Sage 10: "Error importing @roots/bud-sass" on build

Matt_Tanner1 · September 20, 2022, 9:31pm

This is my first time working with Sage 10, but I do have years of experience with Sage 8/9.

I want to remove Tailwind from Sage 10 and write my own SCSS instead, but I’m having trouble with bud-sass.

I followed the documentation here to remove Tailwind, and stopped after finishing step 1 of “Add Boostrap” (because I do want SCSS support, but I don’t want Bootstrap)

Now, when I try to run yarn build, I keep getting this Error importing @roots/bud-sass message:

$: yarn build
yarn run v1.22.19
$ bud build
[bud@6.3.3] [bud] › ⚠  Error importing @roots/bud-sass
 TypeError: undefined is not iterable (cannot read property Symbol(Symbol.iterator))
    at Object.get (file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-sass/node_modules/@roots/bud-framework/lib/extension/index.js:41:69)
    at Extensions.set (file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:78:15)
    at Extensions.import (file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:155:14)
    at async file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:137:17
    at async file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:134:13
    at async Extensions.injectExtensions (file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:130:9)
    at async Extensions.booted (file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:29:9)
    at async file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-framework/lib/lifecycle/index.js:51:17
    at async Promise.all (index 0)
    at async file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-framework/lib/lifecycle/index.js:43:9
[bud@6.3.3] [bud] › ⚠  Error importing @roots/sage
 TypeError: undefined is not iterable (cannot read property Symbol(Symbol.iterator))
    at Object.get (file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-postcss/node_modules/@roots/bud-framework/lib/extension/index.js:41:69)
    at Extensions.set (file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:78:15)
    at Extensions.import (file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:155:14)
    at async file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:159:17
    at async Extensions.import (file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:157:14)
    at async file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:159:17
    at async file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:158:17
    at async file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:158:17
    at async file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:158:17
    at async Extensions.import (file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/ser
[bud@6.3.3] [bud] › ✖  TypeError: undefined is not iterable (cannot read property Symbol(Symbol.iterator))
    at Object.get (file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-postcss/node_modules/@roots/bud-framework/lib/extension/index.js:41:69)
    at Extensions.set (file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:78:15)
    at Extensions.import (file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:155:14)
    at async file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:219:25
    at async Extensions.runDependencies (file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:214:13)
    at async Extensions.run (file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:190:13)
    at async file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:222:25
    at async file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:215:17
    at async file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:215:17
    at async file:///Users/matt/Sites/example.com/site/web/app/themes/sage/node_modules/@roots/bud-extensions/lib/service.js:215:17
✨  Done in 2.71s.

I’ve even tried just adding @roots/bud-sass to a brand new Sage 10 project without removing Tailwind or touching anything, and I still get the same Error importing @roots/bud-sass message when I build.

What am I doing wrong? Does anyone know how to resolve this?

ben · September 20, 2022, 9:42pm

I’m able to re-produce, but this error doesn’t occur with the latest Bud which we will be bumping Sage with shortly

Can you change your Bud dependencies in package.json to use 6.4.1 instead of 6.3.3 and try again?

Simone_Mezzomo · September 20, 2022, 10:52pm

I was having the same issue. Just tried changing Bud version to 6.4.1 and it seems to be working fine!
Thank you!

talentreeweb · September 21, 2022, 6:32am

Thank you! I was having exactly the same problem yesterday and was just about to write a post here about the problem, thanks for the solution.

talentreeweb · September 21, 2022, 6:41am

Never mind the above post, now I am getting new error when running “yarn build” command.
I updated package.json to “@roots/bud”: “6.4.1”, ran “yarn install” then “yarn upgrade” and “yarn build” and got the following error (Cannot read properties of undefined (reading ‘toWebpack’)).

What would be the problem?

Type Error: Cannot read properties of undefined (reading ‘toWebpack’)
at file:///Users/username/Flywheelsites/sagekymppi/app/public/htdocs/wp-content/themes/sagekymppi/node_modules/@roots/bud-build/lib/rule/rule.js:192:39
at Array.map ()
at Rule.toWebpack (file:///Users/username/Flywheelsites/sagekymppi/app/public/htdocs/wp-content/themes/sagekymppi/node_modules/@roots/bud-build/lib/rule/rule.js:192:22)
at file:///Users/username/Flywheelsites/sagekymppi/app/public/htdocs/wp-content/themes/sagekymppi/node_modules/@roots/bud-build/lib/config/module.js:12:109
at Array.map ()
at getRules (file:///Users/username/Flywheelsites/sagekymppi/app/public/htdocs/wp-content/themes/sagekymppi/node_modules/@roots/bud-build/lib/config/module.js:12:92)
at module (file:///Users/username/Flywheelsites/sagekymppi/app/public/htdocs/wp-content/themes/sagekymppi/node_modules/@roots/bud-build/lib/config/module.js:3:25)
at async file:///Users/username/Flywheelsites/sagekymppi/app/public/htdocs/wp-content/themes/sagekymppi/node_modules/@roots/bud-build/lib/service.js:57:27
at async Promise.all (index 10)
at async file:///Users/username/Flywheelsites/sagekymppi/app/public/htdocs/wp-content/themes/sagekymppi/node_modules/@roots/bud-build/lib/service.js:56:65
error Command failed with exit code 1.

fakenso · September 22, 2022, 8:27pm

Bumping. Same problem here.

EDITED:
So you need not only bud related dependencies on 6.4.1. It relates also to the sage version. After changing it to 6.4.1 working seamlessly.