I have console.log’ed in the tap function and compared 6.2.0 vs. 6.3.0 and noticed that app.build.items is in 6.3.0 otherwise identical but sass key is gone.
Then I compared the Bud releases in question and noticed that 6.3.0 no longer has bud/sources/@roots/bud-sass/src/env.ts, which had…:
interface Items { resolveUrl: Build.Item sass: Build.Item } …among some other definitions, which seem relevant.
The @roots/bud-sass loader registration now runs directly after the user config is processed.
You can use the same function as before, but just call it within a build.before callback:
/**
* Use the build.before action to
* ensure that sass is available
*/
app.hooks.action("build.before", async (app) => {
/**
* Override sass-loader options
*/
app.build.items.sass.mergeOptions({
additionalData: `@import "@styles/common/variables";`,
});
});
Sorry about that, I should have communicated this change in the release notes. This change makes it easier to use this extension in only one compiler, if you are running multiple compilers.
Unfortunately doesn’t work for me. What did I wrong?
Error:
[bud@6.3.5] [bud] › ✖ TypeError: app.entry(...).purgecss(...).sass.importGlobal(...).assets is not a function at module.exports (/app/web/app/themes/pai/bud.config.js:29:6)
/**
* @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'],
})
.purgecss({
content: [app.path('resources/views/**')],
safelist: [...require('purgecss-with-wordpress').safelist],
})
.sass.importGlobal('@src/styles/core/variables')
/**
* 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 should be the URL you use to visit your local development server.
*/
.proxy('http://pai-website.lndo.site')
/**
* Development URL to be used in the browser.
*/
.serve('http://0.0.0.0:3000');
};
that’s more of a sass and/or sass-loader question, i think, and i’m not sure what the exact problem is.
i’m guessing you are already importing '@src/styles/core/variables' somewhere in one of your sass partials. You likely need to remove that import. Just a hunch, though, I don’t use this feature.
But the front works well. Styles compile right and work properly.
if with app.sass.importGlobal('@src/styles/core/variables')) and keep app.scss empty or with styles which use variables I have error like and front works too
