Sage not generating any FE assets when making SCSS or JS changes

sage
1

I have just installed Sage for the first time. Everything went smoothly until I started working on CSS and JS. The files are watched and from the Terminal everything looks rosey (“Compiled successfully in 1112ms”).

But, I don’t see any style.css or main.js files. Or even any /dist/ folder. I also don’t see the node_modules folder in my theme either.

There were some warnings when I ran ‘Yarn’…

warning " > autoprefixer@10.4.2" has unmet peer dependency "postcss@^8.1.0".
warning " > eslint-loader@4.0.2" has incorrect peer dependency "eslint@^6.0.0 || ^7.0.0".
warning " > eslint-loader@4.0.2" has incorrect peer dependency "webpack@^4.0.0 || ^5.0.0".
warning " > file-loader@6.2.0" has incorrect peer dependency "webpack@^4.0.0 || ^5.0.0".
warning " > postcss-loader@4.3.0" has incorrect peer dependency "webpack@^4.0.0 || ^5.0.0".
warning " > postcss-loader@4.3.0" has unmet peer dependency "postcss@^7.0.0 || ^8.0.1".
warning " > sass-loader@6.0.7" has incorrect peer dependency "node-sass@^4.0.0".
warning " > stylelint-webpack-plugin@0.10.5" has incorrect peer dependency "stylelint@^8.0.0".
warning " > stylelint-webpack-plugin@0.10.5" has incorrect peer dependency "webpack@^1.13.2 || ^2.7.0 || ^3.11.0 || ^4.4.0".
warning " > url-loader@4.1.1" has incorrect peer dependency "webpack@^4.0.0 || ^5.0.0".

Any ideas what’s happening here?

2

Hi, welcome to the forum. What command are you running in your terminal to watch your files? Is it working despite not seeing the dist directory?

3

Hi, thank you. Good to be here.

I’m using ‘Yarn’ to watch files. Yes all seems to be working. It’s almost like the dist folder is hidden or in a different directory somewhere

4

The correct command for building/watching is yarn start so I’m guessing that’s what you mean. Simply running yarn will install your Node dependencies, but won’t start the watching process.

The dist directory is only created when you run yarn build or yarn production if memory serves.

5

Yes sorry, yarn start. Ok so embarrassingly, I’m using a new text editor and turns out that ignored files/folders aren’t visible by default. I’ve changed that now and can see both the node_modules and dist folders.

In dist I only see a scripts, no CSS. When I make a change to an .scss file the compiler says…

You did not set any plugins, parser, or stringifier. Right now, PostCSS does nothing. Pick plugins for your case on https://www.postcss.parts/ and use them in postcss.config.js.

I’m wondering if this is the issue?

1 Like
6

Are you using Sage 10 beta 2 with Bud? If so, you’ll need to add Sass support :eyes:

There’s some existing topics / GitHub issues with the specifics

If you’re using Sage 9, is it version 9.0.10? If so, you might want to switch to the 9.x branch and read some of the existing topics about how the dependencies have been bumped

7

Hi Benword,

I’m using 9.0.10. Do you mean the 9.x branch in this discourse? I thought I was already??

I’ll see if I can find some other topics specific to postCSS

Thanks

8

There’s a 9.x branch on the git repo that is ahead of 9.0.10, but no tag/release yet associated with the newer commits

9

This topic was automatically closed after 42 days. New replies are no longer allowed.