Bud v6.6.0 released

kellymears · November 15, 2022, 7:06pm

Features, improvements and fixes. Strongly recommended for multi-compiler users.

Breaking: bud.entry no longer parses files as globs

You can use bud.glob if you have need for this.

Example:

export default async bud => {
  bud.entry(`app`, await bud.glob(`@src/*.{js,css}`))
}

Breaking: Built-in extension keys are normalized

label	description	exposed
@roots/bud-extensions/cdn	Adds remote import functionality	bud.cdn
@roots/bud-extensions/esm	Adds ESM support functionality	bud.esm
@roots/bud-extensions/clean-webpack-plugin	Cleans output directory on build
@roots/bud-extensions/copy-webpack-plugin	Copies assets (used by bud.assets)
@roots/bud-extensions/fix-style-only-entrypoints	Removes JS output from entrypoints which only contain CSS
@roots/bud-extensions/html-webpack-plugin	HTML functionality (used by bud.template)
@roots/bud-extensions/interpolate-html-webpack-plugin	Adds `create-react-app`-like template variable support for HTML files
@roots/bud-extensions/mini-css-extract-plugin	Optimized CSS loading
@roots/bud-extensions/webpack-define-plugin	Defines variables which can be used in the application (used by bud.define)
@roots/bud-extensions/webpack-hot-module-replacement-plugin	Adds HMR support
@roots/bud-extensions/webpack-manifest-plugin	Emits `manifest.json`
@roots/bud-extensions/webpack-provide-plugin	Provides import(s) globally to the application

If you were using one of these labels directly, you’ll need to update it. The upshot of this is that your editor will likely not only tell you that it’s wrong but also offer the new key as a suggestion.

Use package signifiers with bud.extensions.add and bud.use

Very convenient! Works for webpack plugins or bud.js extensions.

export default async bud => {
  bud.use('browsersync-webpack-plugin')
}

export default async bud => {
  await bud.extensions.add('browsersync-webpack-plugin')
}

This will only work if the plugin/extension is the default export.

Expand all env values

Variables sourced from .env files in the path to the project are now interpolated using env-expand.
Previously, only the project directory would be expanded.

If you have an unescaped string that causes the expansion to fail the error will be caught.

Better support for hot reload when using multi-compiler

Each bud.js instance’s entrypoints are now registered with @roots/bud-client/hot. This helps to prevent conflicts
with reloaded modules when using multiple bud instances.

Some notes:

Each instance now declares each previous instance as a dependency. This allows the bud.runtime to work even when using multiple instances.
If you are using bud.runtime you will need to make sure that you are specifying single.
If you want to modify the instance dependencies manually, you can use the (new) build.dependencies hook. Or, specify the dependencies in the context argument passed to bud.make.
The bud.make docs have been updated.

Example of a custom dependsOn when setting up a child instance:

export default async bud => {
  bud.make({
    label: `example`,
    basedir: bud.path(`example`),
    dependsOn: [`some-other-instance`],
  })
}

Easier upgrades with `bud upgrade` command

Run bud upgrade to bump bud dependencies to the latest available version.
You will need to run the install after the command completes. This is a new command and is not yet unit tested.

@roots/bud-swc

@roots/bud-swc plugins are configurable

Call bud.swc.plugins to manage @swc/core plugins. You can pass an array of plugins (as demonstrated in the swc docs) or a callback
if you want to modify what’s already there:

export default async bud => {
  bud.swc.plugins(plugins => {
    plugins.push([`swc-plugin`, {option: true}])
  })
}

If you haven’t tried @roots/bud-swc you should consider it. This extension is no longer considered experimental. There is a strong case to be made for it replacing @roots/bud-babel in @roots/bud-preset-recommend for version 7 of bud.js.

@roots/bud-emotion

Supports @roots/bud-emotion

If you have @roots/bud-swc installed, @roots/bud-emotion will register emotion support with @swc/core.

@roots/bud-criticalcss

Option to disable CSS extraction

Disable critical CSS extraction by calling bud.critical.extract(false). This isn’t generally recommended.

@roots/bud-criticalcss remains an experimental extension.

@roots/sage

Fix: proxy assets load when in dev mode

This fix requires acorn v3 and you must set a public path. You can opt-in with bud.sage.setAcornVersion('v3').

With the acorn version set to v3 assets should load when using the proxy directly in dev mode. You will still see 404 errors for the /bud/hot endpoint.

Internal changes

Nothing is required of you, but if you’re curious, here’s what’s changed:

Fix: reload browser on watched files add/unlink

When files are added or removed from a watched directory path the browser will now reload.

Typings: mapped extension options

You should now get useful, accurate intellisense and typechecking when using the bud.extensions api directly.

CLI: warn when using bud.serve in a child compiler

It warns you to move it to the parent context. For now it also does this for you since it’s an understandable mistake and will result in a TypeError.

CLI: cleaner stack traces

There should be less duplication of emitted errors, more meaningful stack traces, and highlighting of important
parts of the error message.

use `nodenext` to resolve node modules

We’re using the nodenext tsc module setting. This enables top-level await for core bud.js packages .

@roots/bud-api is now fully type-safe

strict mode is enabled! We’re beginning to implement runtime validation using zod.

migrate from jest to vitest (#1850)

We switched from jest to vitest because of esm compatibility issues. It’s pretty nice!
Hopefully we’ll be able to run unit tests on the CLI now.

Release information

For more information review the diff to see what’s changed.