Radicle, Bud, bootstrap and sass linting issue. Need help to build assets

bud
1

So I’ve been struggling with this for a few days. Hoping its a dependency issue. I ripped out tailwindcss and added bootstrap with sass. and I can get the assets to build if I remove the “url(” from the import line. So it works like this:

@import "../../node_modules/bootstrap/scss/bootstrap";

But does not work like this:

@import url("../../node_modules/bootstrap/scss/bootstrap");

but once I use Yarn build it lints the app.scss and editor.scss and adds the “url(” back in. Then the next build it fails again.

Here is the error:

ERROR in ./styles/app.scss (./styles/app.scss.webpack[javascript/auto]!=!../node_modules/@roots/bud-support/lib/css-loader/index.cjs??css!../node_modules/@roots/bud-postcss/node_modules/postcss-loader/dist/cjs.js??postcss!../node_modules/resolve-url-loader/index.js??resolve-url!../node_modules/sass-loader/dist/cjs.js??sass!./styles/app.scss)
  Module build failed (from ../node_modules/@roots/bud-postcss/node_modules/postcss-loader/dist/cjs.js):
  Error: Failed to find '../../node_modules/bootstrap/scss/bootstrap'
2

This is the result when I remove the “url(”:

$ /vagrant-nfs-example.test/public/content/themes/radicle> yarn bud build production --no-dashboard
$ /vagrant-nfs-example.test/node_modules/.bin/bud> build production --no-dashboard
/vagrant-nfs-example.test/resources/styles/app.scss: you should use the "customSyntax" option when linting something other than CSS
/vagrant-nfs-example.test/resources/styles/editor.scss: you should use the "customSyntax" option when linting something other than CSS
radicle:
  8 assets
  136 modules
  radicle (webpack 5.88.2) compiled successfully in 32689 ms
3

You want to use SCSS in Sage 10? Have you made all adjustments, see this repository with SCSS-specific adjustments for Sage 10:

4

Thanks for the reply. But I am using the Radicle theme (Not Sage) and Bootstrap (Not Tailwind) with SCSS. I am looking through your setup though to see if there are any clues for me though.

5

Radicle’s theme uses Sage as a starting point :information_source:

The Sage docs have guides for using Bootstrap and Sass as well

6

Thank you, I ended up figuring out that I needed to run trellis init --force and the broken dependencies were flushed everything was installed new and the issue went away.