I just got my first Sage 10 project up and running and everything is working as intended so far. One thing I would like to configure in it, but haven’t been able to find any solid documentation on how to do it, is to configure it to compile SCSS files rather than plain CSS. I tried installing @roots/bud-sass --dev into the project but then I start getting the following build errors. Am I on the right track and just missing some steps or am I way off?
Any help on this would be greatly appreciated!
~Charlie
at Extensions.registerExtension ([secure]/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:134:19)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async [secure]/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:99:17
at async [secure]/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:98:17
at async [secure]/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:98:17
at async [secure]/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:98:17
at async [secure]/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:98:17
at async [secure]/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:98:17
at async [secure]/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:98:17
at async [secure]/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:98:17
Internal Error: Error: TypeError: app.hooks.on(...).build.setLoader is not a function
at Bud.error (/mnt/c/Users/chiller/Documents/ThriveMS/wp-content/themes/thrive/node_modules/@roots/bud-framework/lib/cjs/Framework/index.js:544:15)
at Extensions.injectExtensions (/mnt/c/Users/chiller/Documents/ThriveMS/wp-content/themes/thrive/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:107:22)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async Extensions.boot (/mnt/c/Users/chiller/Documents/ThriveMS/wp-content/themes/thrive/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:73:9)
at async /mnt/c/Users/chiller/Documents/ThriveMS/wp-content/themes/thrive/node_modules/@roots/bud-framework/lib/cjs/Framework/lifecycle/index.js:56:13
at async Promise.all (index 3)
at async /mnt/c/Users/chiller/Documents/ThriveMS/wp-content/themes/thrive/node_modules/@roots/bud-framework/lib/cjs/Framework/lifecycle/index.js:51:9
at async /mnt/c/Users/chiller/Documents/ThriveMS/wp-content/themes/thrive/node_modules/@roots/bud-framework/lib/cjs/Framework/lifecycle/index.js:47:9
at async Bud.lifecycle (/mnt/c/Users/chiller/Documents/ThriveMS/wp-content/themes/thrive/node_modules/@roots/bud-framework/lib/cjs/Framework/lifecycle/index.js:46:5)
at async factory (/mnt/c/Users/chiller/Documents/ThriveMS/wp-content/themes/thrive/node_modules/@roots/bud/lib/cjs/factory/index.js:55:5)```
Hadn’t seen this page before. I just tried installing both @roots/bud-sass and @roots/bud-postcss, changing the app.css file to app.scss. But when I go to build I am still getting the same error.
at Extensions.registerExtension ([secure]/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:134:19)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async [secure]/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:99:17
at async [secure]/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:98:17
at async [secure]/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:98:17
at async [secure]/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:98:17
at async [secure]/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:98:17
at async [secure]/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:98:17
at async [secure]/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:98:17
at async [secure]/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:98:17
Internal Error: Error: TypeError: app.build.setLoader is not a function
at Bud.error (/mnt/c/Users/chiller/Documents/ThriveMS/wp-content/themes/thrive/node_modules/@roots/bud-framework/lib/cjs/Framework/index.js:544:15)
at Extensions.injectExtensions (/mnt/c/Users/chiller/Documents/ThriveMS/wp-content/themes/thrive/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:107:22)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async Extensions.boot (/mnt/c/Users/chiller/Documents/ThriveMS/wp-content/themes/thrive/node_modules/@roots/bud-extensions/lib/cjs/Extensions/extensions.service.js:73:9)
at async /mnt/c/Users/chiller/Documents/ThriveMS/wp-content/themes/thrive/node_modules/@roots/bud-framework/lib/cjs/Framework/lifecycle/index.js:56:13
at async Promise.all (index 3)
at async /mnt/c/Users/chiller/Documents/ThriveMS/wp-content/themes/thrive/node_modules/@roots/bud-framework/lib/cjs/Framework/lifecycle/index.js:51:9
at async /mnt/c/Users/chiller/Documents/ThriveMS/wp-content/themes/thrive/node_modules/@roots/bud-framework/lib/cjs/Framework/lifecycle/index.js:47:9
at async Bud.lifecycle (/mnt/c/Users/chiller/Documents/ThriveMS/wp-content/themes/thrive/node_modules/@roots/bud-framework/lib/cjs/Framework/lifecycle/index.js:46:5)
at async factory (/mnt/c/Users/chiller/Documents/ThriveMS/wp-content/themes/thrive/node_modules/@roots/bud/lib/cjs/factory/index.js:55:5)```
/**
* @typedef {import('@roots/bud').Bud} bud
*
* @param {bud} app
*/
module.exports = async (app) => {
app
/**
* Application entrypoints
*
* Paths are relative to your resources directory
*/
.entry({
app: ['@scripts/app', '@styles/app'],
editor: ['@scripts/editor', '@styles/editor'],
})
/**
* These files should be processed as part of the build
* even if they are not explicitly imported in application assets.
*/
.assets('images')
/**
* These files will trigger a full page reload
* when modified.
*/
.watch('resources/views/**/*', 'app/**/*')
/**
* Target URL to be proxied by the dev server.
*
* This is your local dev server.
*/
.proxy('http://localhost/')
/**
* Development URL
*/
//.serve('http://localhost:8080/');
};
@chiller I think it’s highly probable you have a versions mismatch. To me it looks like @roots/bud-sass is trying to do a call introduced in 5.6. I’m guessing @roots/bud is at <=5.5.
Internal Error: Error: TypeError: app.build.setLoader is not a function
Make sure everything is @ 5.6.2 and you should be golden.