v5.6.1

This small update is recommended for all users of 5.6.x.

• 🩹 fix: theme.json generator in #1240

v5.6.0

Performance

bud is now about 30% faster 🎉.

There is a new CLI flag --flush which will force a full recompilation if you feel like something is goofy. It's also recommended to run bud clean after installing an update.

Notifier

MacOS notification center notices are fixed. If you don't want them run the cli command with the --no-notify flag.

bud.path and bud.setPath

TLDR: Way less clunky to work with.

• bud.path() can be called with no parameters will now resolve to the project root.

• bud.path('relative/path') now returns an absolute path from a project relative one.

• bud.path('/absolute/path') is recognized as an absolute path and will not be interpolated.

• There are several reserved strings referencing key directories: @src, @dist, @storage, @modules. The @ prefix is now being used to make it clearer that this is not a normal path.

• You can use bud.setPath to define additional directory aliases:

bud.setPath({'@config': 'app/config/directory'})

bud.path('@config/config-file.json')
// => [root]/app/config/directory/config-file.json

• This only applies to the first segment and only when the @ symbol is prefixed. app/@alias/example will not work.

• This does not automatically make webpack aliases from a path. To use the same convention in your client scripts you still need to use bud.alias.

⚠️ Upgrade guide

• Any calls which referenced 'project' as the first parameter should have that parameter removed. Examples:

  • bud.path('project') becomes bud.path().
  • bud.path('project', 'directory') becomes bud.path('directory').

• Any calls which used src, dist, storage or modules as the first parameter should be updated to use the @ prefix. Examples:

  • bud.path('src', 'some-file.js') becomes bud.path('@src', 'some-file.js').
  • Or, just bud.path('@src/some-file.js').

• Any calls to bud.setPath which referenced those magic strings also needs to be updated. Example:

  • bud.setPath('src', 'js') becomes bud.setPath('@src', 'js')

Defining modules is a lot easier

Want to add support to bud for some arcane syntax? Great news, the API for loaders, items and rules just got a nice upgrade.

Here's typescript.

app.build
  .setLoader('ts', 'ts-loader')
  .setItem('ts', {loader: 'ts', options: {}})
  .setRule('ts', {test: /\.tsx?/, use: [`babel`, `ts`]})

If you just want to modify an existing rule, there is lots for you in this update:

app.bulid.rule.ts.setUse([`babel`, `ts`])
app.build.loaders.ts.setSrc(`alternate-ts-loader`)
app.build.items.ts.setOptions({...options})

Extension authors should take advantage of how all properties for loader, item, and rule definitions can be expressed with a callback. This means if someone changes their source path later your rule will still be pointed in the right direction.

More information

• Read the release notes
• Review the diff to see what's changed

Changelog

• 📚 docs: update by @kellymears in #1221
• 📚 docs: add discourse link by @retlehs in #1223
• 🩹 fix: docs fouc by @kellymears in #1222
• ✨ feature: add discourse topic release workflow by @retlehs in #1234
• 🛼 improve: build, cache, compiler by @kellymears in #1229
• 🩹 fix: macos notifier by @kellymears in #1236

Full Changelog: v5.5.0...v5.6.0

v5.5.0

For more information read the 5.5.0 release post.

Features

• 🎉 feature: ssl support by @strarsis & @kellymears in #1069
• 🎉 feature: @roots/sage theme.json support by @kellymears in #1199

Fixes

• 🩹 fix: disable selector-id-pattern in Sage config by @joshuafredrickson in #1209

Full Changelog: v5.4.0...v5.5.0

v5.4.0

Heads up

• ⚠️ Eslint configs have been centralized in the new @roots/eslint-config package. If you are using a @roots eslint config please use the appropriate export from @roots/eslint-config instead. These exports will be removed in 5.5.0.
• ⚠️ Verbose logging is now disabled by default. To enable logging use the --log flag.
• ⚠️ @roots/sage users no longer need to specify paths in package.json. You can remove the bud key entirely.

New and noteworthy

👀

• 🎉 feature: @roots/eslint-config by @kellymears in #1020
• 🎉 feature: rule.includes as an array by @kellymears in #1179
• 🎉 feature: replace oclif with clipanion by @kellymears in #1153

Fixes

• 🩹 fix: late extensions are assumed to be modules by @kellymears in #1140
• 🩹 fix: tailwindcss shouldn't throw when there is no config by @kellymears in #1141
• 🩹 fix: remove click interceptor instanceof check by @kellymears in #1150
• 🩹 fix: ci logging by @kellymears in #1158
• 🩹 fix: json logging errors by @kellymears in #1183
• 🩹 fix: @roots/bud-entrypoints option export by @kellymears in #1185
• 🩹 fix: devtool facade typings by @kellymears in #1186

Improvements

• 🙌 improve: eslint/stylelint base config by @kellymears in #1134
• 🙌 improve: process logger by @kellymears in #1171
• 🙌 improve: @roots/sage preset by @kellymears in #1172
• 🙌 improve: cli backwards compatibility by @kellymears in #1180

Full Changelog: v5.3.2...v5.4.0

v5.3.2

Fixes

• deps: update stylelint by @kellymears

Full Changelog: v5.3.1...v5.3.2

v5.3.1

Fixes

• fix(bud): ensure parallism is at least 1cpu by @QWp6t (#1130) (Thanks @Pederytter)

Full Changelog: v5.3.0...v5.3.1

v5.3.0

New and noteworthy

@roots/bud-typescript

• There is a typescript eslint config available to import from @roots/bud-typescript/eslint-config.
• There is a base tsconfig available to import from @roots/bud-typescript/tsconfig/tsconfig.json. For the most part this config is identical to the Microsoft recommended tsconfig except that it allows jsx/tsx to be passed through to @roots/bud-babel.

@roots/bud-sage

• The domReady function is available for import from @roots/sage/client.

@bud.assets

In 5.2.0 it was required to use absolute paths with this function. That was a temporary solution; you can now pass copy items in a variety of ways — including as a standard copy-webpack-plugin options object.

Fixes

• fix(cli): bud doctor by @kellymears in #1059
• fix(cache): move webpack cache into subdir by @kellymears in #1060
• fix(dashboard): conditional dashboard imports by @kellymears in #1067
• fix(eslint): loader caching by @kellymears in #1068
• fix(build): check for valid browserslist before defining by @kellymears in #1099
• fix(server): do not inject proxy client fix into non-proxy app by @kellymears in #1097
• fix(server): type error: watcher undefined by @kellymears in #1098
• fix(copy-webpack-plugin): update interface by @QWp6t in #1052

Improvements

• improve(framework): add exception handling by @kellymears in #1053
• improve(cli): bud build command by @kellymears in #1063
• improve(typescript): improved configurability by @kellymears in #1062
• improve(dashboard): rendering by @kellymears in #1054 and #1096
• improve(react): general plugin improvements by @kellymears in #1104
• improve(api): improved bud.assets function by @kellymears in #1114

Full Changelog: v5.2.0...v5.3.0

Bud v5.2.0

A big change for dependency management with a couple very important bug fixes.

Deprecations

setPublicPath (when using @roots/sage)

bud.setPublicPath is deprecated when using the @roots/sage preset.

Setting the public path in roots/sage will break builds now that it is no longer needed (it'll end up doubling up URLs in Acorn). We know that's annoying so @roots/sage (the extension) overrides setPublicPath with a function that intentionally lets the passed value fall through.

The function is flagged as @deprecated and will be marked as such in most modern IDEs. You should remove it from your config before roots/sage leaves beta.

See improve(server) proxy middleware (#1008)

Directly installing dependencies is optional

In Bud v5.0.0 and v5.1.0 it became very clear that the framework's way of handling dependency management was not working anywhere near as well as we had hoped it would. I'd estimate over half of the problems brought up had to do with mismatched dependencies.

The bud install command was meant to make it easy. I wouldn't say it made it harder, but it definitely didn't make it easy.

For v5.2.0 we're doing something really different and much more in keeping with other tools that work similarly to bud (nextjs, create-react-app, etc). We're going to include the batteries.

This means users do not need to specify anything in package.json outside of the extension they want to use. So, if you want to try @roots/bud-sass you just install the extension. No need to run bud install or manually add sass. It should already be at the top level of node_modules, a proper peer to your project, ready to be resolved.

Compare the roots/sage manifest from 5.1.0:

"devDependencies": {
    "@babel/eslint-parser": "^7.16.5",
    "@roots/bud": "^5.1.0",
    "@roots/bud-eslint": "^5.1.0",
    "@roots/bud-postcss": "^5.1.0",
    "@roots/bud-prettier": "^5.1.0",
    "@roots/bud-stylelint": "^5.1.0",
    "@roots/bud-tailwindcss": "^5.1.0",
    "@roots/sage": "^5.1.0",
    "@wordpress/browserslist-config": "4.1.0",
    "eslint": "8.6.0",
    "postcss": "8.4.5",
    "postcss-import": "14.0.2",
    "postcss-nested": "5.0.6",
    "postcss-preset-env": "7.1.0",
    "react": "17.0.2",
    "react-dom": "17.0.2",
    "tailwindcss": "3.0.8",
    "prettier": "2.5.1"
}

to the one for 5.2.0:

"devDependencies": {
  "@roots/bud": "5.2.0",
  "@roots/bud-eslint": "5.2.0",
  "@roots/bud-postcss": "5.2.0",
  "@roots/bud-prettier": "5.2.0",
  "@roots/bud-stylelint": "5.2.0",
  "@roots/bud-tailwindcss": "52.0",
  "@roots/sage": "5.2.0"
}

It seems like it's going to be a lot more manageable. For bud users and maintainers.

Users can still override the installed version of any dependency by installing it themselves. Bud has also relaxed its verison requirements to be much more tolerant of discrepencies.

See improve(bud) dependency strategy (#1005)

Easier stylelint configs

When relevant, all extensions now come with a stylelint export for you to use as a starting point.

Here's a config that works well with tailwindcss:

{
  "extends": [
    "@roots/bud-stylelint/config",
    "@roots/bud-tailwindcss/stylelint-config"
  ]
}

And if a user wants to try tailwindcss in a sass stylesheet, they no longer need to figure out how to do that themselves.

{
  "extends": [
    "@roots/sage/stylelint-config",
    "@roots/bud-tailwindcss/stylelint-config",
    "@roots/bud-sass/stylelint-config"
  ]
}

This release should be able to close the door on issues like [#731] CSS lint errors for SCSS stylesheet files (e.g. Unknown word; ...)

Here's the list of modules:

extension	export
@roots/bud-stylelint	'@roots/bud-stylelint/config'
@roots/bud-tailwindcss	'@roots/bud-tailwindcss/stylelint-config'
@roots/bud-sass	'@roots/bud-sass/stylelint-config'
@roots/sage	'@roots/sage/stylelint-config'

Easier eslint configs

There are a number of configs available to use in your eslint config as a base:

module.exports = {
  root: true,
  extends: [
    require.resolve('@roots/sage/eslint-config'),
    require.resolve('@roots/bud-prettier/eslint-config'),
  ],
}

Here's the list of modules:

extension	export
@roots/bud-eslint	'@roots/bud-eslint/eslint-config'
@roots/bud-babel	'@roots/bud-babel/eslint-config'
@roots/bud-preset-wordpress	'@roots/bud-preset-wordpress/eslint-config'
@roots/bud-preset-recommend	'@roots/bud-preset-recommend/eslint-config'
@roots/bud-prettier	'@roots/bud-prettier/eslint-config'
@roots/bud-react	'@roots/bud-react/eslint-config'
@roots/sage	'@roots/sage/eslint-config'

Fixes and improvements

• Setting a publicPath no longer needed for proxy 🎉
• Fixes INVALID_URL error message emitted by HPM logger
• bud.use was not configured behind a facade. It is now a synchronous interface over an asynchronous function (like the rest of the async fns in @roots/bud-api). This was obviously causing issues (see #1003 (comment)). A unit test has been added to make sure it returns Framework and not Promise<Framework>
• bud.splitChunks now breaks all of the "dev boilerplate" (think: hot reload scripts, core-js polyfills, webpack client code, ansi parsers, bud's client scripts, etc.) into a separate chunkGroup: vendor/bud.js. This cleanly separates vendor code (being used by the app), "bud" code, and the application code. This doesn't effect production at all since none of the packages in the bud chunk group are used outside of dev.
• Fixes bud.watch.

Changelog

• Fix release branch push
• chore: 5.1.0 release post (#1001)
• renovate - target main (#988)
• improve(dev) ci & dx (#1009)
• improve(server) proxy middleware (#1008)
• improve(bud) dependency strategy (#1005)
• fix(server) bud.watch (#1007)
• chore(deps): bump node-fetch to v3.1.1 [security]
• chore(deps): bump @babel/core to v7.16.12
• chore(deps): bump tailwindcss to v3.0.16

Compare: https://github.com/roots/bud/compare/v5.1.0...main

Contributors

Thanks to everyone who contributed to this release!

• @kellymears
• @retlehs
• @swalkinshaw

Bud v5.1.0

Bud v5.1.0 is a minor release. It includes a couple anticipated features and bug fixes.

There are many fixes and core improvements based on feedback from the v5.0.0 release. Thanks to everyone who filed issues. There are a couple minor breaking changes.

Adds support for webp 🎉

We now have an automated release process and will be publishing updates much faster. Thanks for your patience! It took a lot of work to get to this place and we think it's going to prove to be worth it for our project and yours.

Known issues

If you use npm to install bud, you may need to remove dependencies that are shared with bud extensions in order to install the update.

After installation, run npx bud install followed by npm install to resolve everything.

In the near future bud will relax semver requirements to address this annoyance.

Breaking

There are relatively minor breaking changes for users of @roots/bud-imagemin and @roots/sage and one breaking change in core.

bud.assets requires absolute paths

If you wanted, consider the bud.path helper to easily get an absolute path.

Resolve relative to the the src directory:

bud.assets([bud.path('src', 'images/**/*.{jpg,png}')])

Resolve from the root of your project:

bud.assets([bud.path('project', 'src/images/**/*.{jpg,png}')])

In the future, hopefully this will not be a requirement. But for now it is.

@roots/bud-imagemin

We have switched to @squoosh/lib and there is a new configuration API. It should be an easy change. See @roots/bud-imagemin docs.

@roots/sage

Users need to opt-in to specific features by installing:

• @roots/bud-stylelint
• @roots/bud-eslint
• @roots/bud-tailwindcss
• @roots/bud-prettier

Changelog

• fix(deps): bump image-minimizer-webpack-plugin to v3
• fix(framework): fixed font rule
• fix(bud-eslint): use @babel/eslint-parser
• feature(entrypoints-webpack-plugin): option to emit as html
• improve(bud-eslint): modularize eslint configs
• fix(framework) directory for emitted assets
• feat(framework) support webp
• fix(sage) public path
• fix(bud-purgecss)
• fix(framework) module import/registration order
• fix(framework) bud.assets: do not emit to assets dir
• fix(framework) module import/registration order
• improve(sage) dependencies removed from extension
• fix(framework) assets in nested directories
• fix(framework) fix inject client script for zero entry compilers
• fix(framework) fix sourcemap warning
• fix(sage) hmr fixes
• improve(framework): automated releases

Contributors

Thanks to everyone who contributed to this release!

• @kellymears
• @QWp6t
• @retlehs
• @swalkinshaw
• @austinpray

Bud v5.0.0

The most important change

You no longer need to explicitly require an extension in your configuration file or call bud.use to load it. Bud will automatically load the extensions you have installed.

Breaking

• @roots/bud-cli has been deprecated. CLI functionality is packaged with @roots/bud.
• bud.use method is now asynchronous.
• bud.build.make method is now asynchronous.
• Hook key build now refers to an asynchronous filter.
• Hook key build.plugins now refers to an asynchronous filter.
• bud.extensions.enqueue can be used to enqueue a plugin and returns Bud instance for chaining.
• @roots/bud no longer exports Framework. Use Bud or import Framework from @roots/bud-framework instead.

Added

• Yaml, json5 and TypeScript config file support.

• Multi-compiler support:

  • bud.make will create a new Bud instance for you to configure.
  • bud.get will retrieve a previously made child instance for further configuration.
  • bud.set allows setting a Bud instance as a bud.children entry.
  • bud.root always returns the parent compiler. If called from the parent it will return itself.
  • bud.isRoot will be true in the parent context.
  • bud.hasChildren will be true in the parent context if there are child Bud instances.

• Several new hooks:

  • event.build.make.before is called just before the webpack config is created (async).
  • event.build.make.after is called just after the webpack config is created (async).
  • event.compiler.before is called just before the final config is passed to webpack.
  • event.compiler.after is called just after the final config is passed to webpack.

• New CLI commands:

  • bud clean - removes dist and cache files
  • bud doctor - check for missing peer dependencies and configuration errors
  • bud install - automatically install/update required dependencies
  • bud serve - start the development server and initiate hot module reloading

• New bud build flags:

  • --target Target a specific Bud instance to be built in isolation. Can be passed multiple times to target more than one compiler.
  • --[no]-cache Toggle filesystem caching. [default: true]
  • --cache.type Set the cache type. Can be filesystem or memory. [default: filesystem]
  • --location.[src|dist|project|storage] Set a project disk location
  • --[no]-log - Toggle logging [default: true]
  • --[no]-log.level - Set logging level (v, vv, vvv, vvvv) [default: vvv]
  • --[no]-log.papertrail - Allow logger lines to overwrite the previous line from the same scope [default: --no-log.papertrail]
  • --log-secret - Suppress a string from logger output (can use multiple times) [default: --log-secret {cwd}]
  • --[no]-dashboard - Toggle the bud dashboard [default: --dashboard]
  • ...many more! add --help after any command to see what options are available.

• example project demonstrating how to use off-the-shelf webpack plugins with bud.use

Improved

• Greatly improved performance. The entire Bud lifecycle is asynchronous.
• Installed extensions are now automatically registered and booted.
• Peer dependency requirements are now checked. Missing dependencies will not throw an error but will be logged.
• bud.use now supports using Webpack plugins directly.
• Informative logging.
• The CLI and dashboard have a fresh coat of paint.
• New notification center integration (MacOS only)
• Dashboard warnings and errors are now better displayed in the console.

Fixed

• bud.proxy - fixed proxy interceptor
• bud.serve - fixed development server public path
• bud.serve - disables module hashing in development mode. this is enforced

Internal

• @roots/bud-typings has been deprecated.
• Added @roots/yarn-plugin-kjo to provide utilities in the yarn @bud namespace.

Extension specific notes

The following notes only apply to specific extensions:

• @roots/bud-tailwindcss - updated to version 3.
• @roots/bud-sass - uses postcss-scss to avoid syntax conflicts between sass and postcss.

Contributors

• kellymears
• QWp6t
• benword