v6.11.0

A bunch of cool features, fixes and improvements.

If you have any trouble installing try the --force flag.

Breaking changes

• There have been some fixes made to bud.assets which make the function behave much more predictably. Still, I'm concerned there might be workarounds people are using which will no longer be working around. Check out the documentation and consider replacing complex bud.assets calls with the new bud.copyFile and bud.copyDir functions.

• If you are configuring bud.js with JSON or YML you will need to update any functions which accept a single argument which is an array. bud.config.json and bud.config.yml arguments are now expressed as an array, so there is no good way for the config parser to determine that you actually wanted to pass an array and not multiple params.

  assets: 
  -  - 'image.jpeg'
  +  - ['image.jpeg']

• If you have been using the new blade view directives in your Sage project you will need to update them. There is now a single directive to replace all previous directives: @module. So, @js import '@scripts/confetti.js' @endjs becomes @module('js') import '@scripts/confetti.js' @endmodule. This should support all module types now, generically. Built-in support for this feature is still in process for roots/acorn. An example ModuleDirective and EndModuleDirective class have been updated and included in @roots/blade-loader/vendor.

  -@js
  +@module('js')
  console.log('hello')
  -@endjs
  +@endmodule

Deprecations

A bunch of extension functions are going to be removed at some point in the future (bud.js 7). Most of these are simple wrappers for the built-in extensions API.

If you are using a deprecated function you can expect IDE notifications (if you use an IDE that supports the @deprecated doctype), but you will also see warnings in the terminal with specific instructions for how to update the call.

We'll go slow when removing these functions; don't fret about it. This github issue (#2079) is dedicated to tracking related function deprecations.

Improved WordPress editor support

Easily add blocks, plugins, filters, styles, variations and formats in production and development with next to no boilerplate along with full hot module reloading (HMR) support.

See the updated documentation for specifics on implementing it in your WordPress project. There is also a new example in the examples directory to get a feel for how it comes together.

This feature is new so I suspect early adopters may bump into issues. But, we've been using the underlying library that powers this for many months now and it seems to work quite well in-house.

Improved yml and json config support

See the updated documentation. Short version: anything you can do in a js file you can now do in a yml file.

New functions for copying files

These two functions are a lot more predictable for you and will be a lot easier to maintain for me. I'd recommend replacing bud.assets with them (although I've tried to do what I can to improve it in this release).

bud.copyDir

See documentation for details.

bud.copyFile

See documentation for details.

Improved errors

There is better error handling in a few critical areas. Hopefully you'll never notice.

Early errors

Ever make a syntax error in your bud.config.js file? Me neither. But if I did the error would happen before bud.js (and it's logger) had even been instantiated.

Not anymore!

Error reading config file:
bud.config.mjs appears to be a bud config file, but it could not be imported.

Original error follows:
SyntaxError: Unexpected token '}'
    at file:///bud/sources/@roots/bud/lib/context/config.js:62:31
    at async Promise.all (index 4)

bud.when errors

If you pass a non-function argument to bud.when it will throw an error now. I've seen a few people do this and it's an understandable mistake. I'm sorry for the error but it wasn't doing what you wanted before.

This is the specific mistake I saw most recently.

/* This will now throw */
bud.when(
  bud.isProduction, 
  bud.minimize(), // oops!
)

The problem is that the function is being called right there! It's whatever value the function returns by the time bud.when receives it. It doesn't cause a type error but it's obvious something is wrong.

The corrected version would just wrap the bud.minimize() call in an arrow function:

bud.when(
  bud.isProduction, 
  () => bud.minimize() // corrected
)

Anyway, there will be instructions in the console if you are bit by this.

Unsupported platform errors

If you run bud.js on Windows outside of a WSL environment, it won't try and stop you, but it also won't work. This is mentioned in both the project README.md and our Getting Started guide, and yet many people still post support requests related to errors experienced while using Windows.

Now, errors are accompanied by a reminder that the platform is not supported, which should hopefully reduce support request volume.

If you use Windows and want to see native support for Windows in bud.js please submit an issue and accompanying PR!

Improve bud doctor

bud doctor now displays additional information about the project and has a couple new checks.

Fix: sass/vue/sage (in combination)

Fixes an issue that could create blank stylesheets (with no error thrown from vue-loader). Adds reproduction to prevent regressions.

Fix: @roots/bud-prettier format command

Thanks to @nlemoine for fixing the bud format command.

Docs contributions

Big thanks to @dsturm for their continued work improving bud.js' documentation 🙏🏼.