sage: Sage 9.0.10 - postcss.config.js not working

I’ve read the guidelines for Contributing to Roots Projects
This request isn’t a duplicate of an existing issue
I’ve read the docs and followed them (if applicable)
This is not a personal support request that should be posted on the Roots Discourse community

Description

After the latest release postcss.config.js gives an error, this

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.

Steps to reproduce

Installed a fresh copy and and use yarn start && yarn build
Installed a fresh copy of version 9.0.9, this works like expected

Expected behavior: Everything for building the website works like a charm

Actual behavior: The template building does not work like it should work, for example I’m unable to load custom fonts in version 9.0.10 because postcss.config.js doesn’t work during development

Reproduces how often: This issue occured since the latest version 9.0.10

Versions

9.0.10

About this issue

Original URL
State: closed
Created 4 years ago
Reactions: 16
Comments: 20 (9 by maintainers)

Most upvoted comments

To anyone else hung up on this, I found a workaround. My version of this issue was not font related, but rather image related. I was trying to use a background image in my css and stumbled across the same errors.

In looking for a solution, others were suggesting just rolling back to 9.0.9 which certainly worked. That said, I thought it would be nice to just roll back the packages that were at the root of this issue for me rather than rolling back a full version. With that, I narrowed this issue down to a few specific dev dependencies and changed them to the following versions:

"postcss-loader": "~2.1.0", "postcss-safe-parser": "~3.0", "resolve-url-loader": "~2.3.1", "url-loader": "^0.6.2",

After updating my package.json to have those older dev dependencies from 9.0.9, deleting my node_modules, and running a:

yarn && yarn start

my version of this issue worked itself out. Hope that helps anyone else who’s currently down this rabbit hole!

+17

ghost on Dec 22, 2020

Strange that Sage 9.0.10 is currently the default included when running composer create-project roots/sage your-theme-name and is riddled with this many issues for handling assets.

9.0.10 has Composer 2 support which is what I need to proceed after bringing up Trellis/Bedrock to the latest version. Sage 10 doesn’t have routes and bundled Tailwind by default, which makes me avoid it for now. Finally got 9.0.10 running fine after @Jacksoor and @salty-walty’s suggestions of selectively downgrading the packages:

"file-loader": "^1.1.6"
"postcss-loader": "~2.1.0",
"postcss-safe-parser": "~3.0",
"resolve-url-loader": "~2.3.1",
"url-loader": "^0.6.2",

Seems like there’s no stable go-to version of Sage out there at the moment.

+12

artshostak on Apr 30, 2021

I also had to change: "file-loader": "^1.1.6" Maybe the fix detailed here is enough.

Jacksoor on Jan 23, 2021

@dock70: You have to add one more ../ as the paths are now relative to the style files (which is actually more correct).

strarsis on Feb 16, 2021