Closed derek-zhou closed 3 years ago
Can you show the full error message?
The full error message is very long. It just shows my processed CSS then said it is not a postcss plugin. The CSS process itself is good. postcss-cli works too. Seems like somehow postcss believe the css process is not completed and need further processing? If you are not seeing this it must be some particular packages combination I have that cause this. What I know is:
Can you show at least a full stacktrace?
you mean this:
@media (min-width: 1280px) {
.xl\:container {
max-width: 1280px;
}
}
}
is not a PostCSS plugin
at Processor.normalize (/home/derek/projects/roastidious/assets/node_modules/postcss/lib/processor.js:60:15)
at new Processor (/home/derek/projects/roastidious/assets/node_modules/postcss/lib/processor.js:9:25)
at postcss (/home/derek/projects/roastidious/assets/node_modules/postcss/lib/postcss.js:24:10)
at LazyResult.runOnRoot (/home/derek/projects/roastidious/assets/node_modules/postcss/lib/lazy-result.js:276:16)
at LazyResult.runAsync (/home/derek/projects/roastidious/assets/node_modules/postcss/lib/lazy-result.js:328:26)
I can try to make a minimal case and put it in github, but that has to wait til tomorrow.
@derek-zhou somebody sends something wrong to PostCSS.
Can you remove tailwindcss and autoprefixer? Minimal case will be very useful.
I have a minimal case here: https://github.com/derek-zhou/example.git tested to fail on 2 machines, one 64 bit linux node v10.15.2, one 32 bit linux node v 10.22.1
to repro, just npm install && npx webpack
Just come across this same issue, but only when running the plugin through webpack postcss-loader (postcss-nested runs fine via cli)
I was trying to debug something else and ran into this. My minimal config is
app.css
div {}
webpack.config.js
var config = {
context: __dirname,
entry: {
css: "./app.css",
},
module: {
rules: [
{
test: /app.css/,
use: [
"css-loader",
"postcss-loader",
],
},
],
},
}
module.exports = config
postcss.config.js
module.exports = {
plugins: [
require('postcss-nested'),
]
}
I get
ERROR in ./app.css
Module build failed (from ./node_modules/postcss-loader/dist/cjs.js):
Error: div {}
is not a PostCSS plugin
at Processor.normalize (/home/sebastian/Source/sporto/postcss-nested-repro/node_modules/postcss/lib/processor.js:60:15)
at new Processor (/home/sebastian/Source/sporto/postcss-nested-repro/node_modules/postcss/lib/processor.js:9:25)
at postcss (/home/sebastian/Source/sporto/postcss-nested-repro/node_modules/postcss/lib/postcss.js:24:10)
at LazyResult.runOnRoot (/home/sebastian/Source/sporto/postcss-nested-repro/node_modules/postcss/lib/lazy-result.js:276:16)
at LazyResult.runAsync (/home/sebastian/Source/sporto/postcss-nested-repro/node_modules/postcss/lib/lazy-result.js:328:26)
at LazyResult.async (/home/sebastian/Source/sporto/postcss-nested-repro/node_modules/postcss/lib/lazy-result.js:178:30)
at LazyResult.then (/home/sebastian/Source/sporto/postcss-nested-repro/node_modules/postcss/lib/lazy-result.js:163:17)
Update: change
require('postcss-nested'),
to simply:
'postcss-nested',
in postcss.config.js fixes this issue. It is not entirely clear which is the correct way to config postcss; postcss doc and postcss-loader doc use different styles. The few other plugins that I use can tolerate both styles, so is postcss-nested@4.2.3. It is just postcss-nested@5.0.1 that cannot tolerate the require.
Both syntaxes should be supported, but seems like there is an issue in plugin loading mechanism
It was a postcss-loader
plugin loadings issue. I send them a fix
Fixed in postcss-loader
4.0.3
I am seeing:
After upgrade to 5.x. 4.2.3 is fine. My postcss.config.js is:
relevent part of my package.json: