How do I configure bud properly?

I’m trying to figure out how to configure bud properly without Sage.


How do the below paths get resolved?

      app: ["@scripts/app", "@styles/app"],
      editor: ["@scripts/editor", "@styles/editor"],

I know a webpack.config.js is being generated, but where can I configure the aliases in the bud config?

For now I set the paths relative to the file and bud now picks them up.


Edit: Just found this, but setting an alias doesn’t change much, builds are still in ‘src’ and ‘dist’…

Edit2: Also found this, but the example also uses the default paths.

And another thing, I’ve added @roots/bud-preset-wordpress and @roots/bud-sass, yet I still get the following error, am I missing a setting? This only happens when I divert from the default src folder.

ERROR  ./assets/styles/app.scss

Module parse failed: Unexpected token (1:5)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See


Also, my files aren’t being watched… I have a folder with twig templates (theme_folder/views), but when I edit these, the build process is not getting triggered. My bud.config.mjs settings are:


// @ts-check

 * Build configuration
 * @see {@link}
 * @param {import('@roots/bud').Bud} app
export default async (app) => {
     * Application entrypoints
      app: ["./assets/scripts/app.js", "./assets/styles/app.scss"],
      editor: ["./assets/scripts/editor.js", "./assets/styles/editor.scss"],

     * Directory contents to be included in the compilation

     * Matched files trigger a page reload when modified
    .watch(["views/**/*", "*.php"])

     * Proxy origin (`WP_HOME`)

     * Development origin, don't forget to add ' bud' to your hosts

     * URI of the `public` directory


  "devDependencies": {
    "@roots/bud": "^6.3.5",
    "@roots/bud-preset-wordpress": "^6.3.5",
    "@roots/bud-sass": "^6.3.5"
  "scripts": {
    "dev": "bud dev",
    "build": "bud build"

Thanks! :zap:

Does anyone have a clue? I really want to use bud in the new theme set-up for my team because of it’s speed, but can’t because of this issue.

I’m still looking for an answer. Is there anyone here who has set up bud successfully for a custom theme other than Sage?

Thanks. :slightly_smiling_face:

Howdy! Bud’s Sage extension handles a good bit of functionality. You might want to take a look into the source/docs of that extension to see what you might need to use.

If you need some further assistance, providing a git repo for someone to be able to pull down and reproduce would be a good start!

It’s also possible to book a call with Kelly (via GitHub Sponsors) if you really need to get unblocked quicker

Thanks for the reply, Ben.

My biggest issue is that the documentation seems to be incomplete. But maybe I’m just overlooking things or expected to know more than I do.

I’ve stripped my repository to the bare minimum so everyone can reproduce my issues.

My issues:

  • Assets are not built in the correct folders
  • Webpack is asking for appropriate loaders

Expected outcome:

  • Built assets in public folder
  • No errors when building from a scss file

Current outcome:

  • Built assets in dist folder
  • You may need an appropriate loader to handle this file type error when building


What is missing from the docs? FWIW, L9-11 and L15-18 of your Bud config do not look correct for what you’re trying to accomplish

Ref: bud.setPath | bud.js
Ref: bud.entry | bud.js

Untested, but try something like:


      "@src": "assets",
      "@dist": "public",

      app: ["scripts/app", "styles/app"],
      editor: ["scripts/editor", "styles/editor"],


That’s it. I definitely overlooked it. Thanks for looking.

1 Like

Hey @ben,

I’m facing one more issue: my selected files are not being watched.

I want twig files in views and php files in includes to be watched. I’ve added this to my configuration:

     * Matched files trigger a page reload when modified
    .watch(["views/**/*", "includes/**/*"])

Used Sage as an example. Bud is not being triggered upon save in these directories.