Closed ReindDooyeweerd closed 2 years ago
Hi @Vout
I wasn't able to reproduce your error.
However it sounds to an incompatibility issue. I've upgraded all dependencies in https://github.com/SassNinja/postcss-extract-media-query/pull/37 which also includes postcss.
In the course of this postcss has become a peer dependency what will probably solve your problem (you'll have to upgrade your project's postcss version to 8.x though)
So the bottom line is, the next release of my plugin (3.0.0) will fix your problem!
I tried to implement
postcss-extract-media-query
inside webpack but i keep running into this error,Unknown error from PostCSS plugin. Your current PostCSS version is 7.0.35, but postcss-extract-media-query uses 6.0.23. Perhaps this is the source of the error below.
Followed by,
ERROR in ./assets/scss/app.scss friendly-errors 22:07:18 Module build failed (from ./node_modules/postcss-loader/src/index.js): friendly-errors 22:07:18 TypeError: Cannot read property 'syntax' of undefined at /Volumes/SSD/Projects/Purvis/Frontend/assets/scss/app.scss:369:3 at Root.toString (/Volumes/SSD/Projects/Purvis/Frontend/node_modules/postcss-syntax/patch-postcss.js:38:67) at /Volumes/SSD/Projects/Purvis/Frontend/node_modules/postcss-extract-media-query/index.js:81:63 at /Volumes/SSD/Projects/Purvis/Frontend/node_modules/postcss/lib/container.js:314:16 at /Volumes/SSD/Projects/Purvis/Frontend/node_modules/postcss/lib/container.js:139:18 at Root.each (/Volumes/SSD/Projects/Purvis/Frontend/node_modules/postcss/lib/container.js:105:16) at Root.walk (/Volumes/SSD/Projects/Purvis/Frontend/node_modules/postcss/lib/container.js:135:17) at Root.walkAtRules (/Volumes/SSD/Projects/Purvis/Frontend/node_modules/postcss/lib/container.js:312:17) at /Volumes/SSD/Projects/Purvis/Frontend/node_modules/postcss-extract-media-query/index.js:75:18 at LazyResult.run (/Volumes/SSD/Projects/Purvis/Frontend/node_modules/postcss/lib/lazy-result.js:288:14) at LazyResult.run (/Volumes/SSD/Projects/Purvis/Frontend/node_modules/postcss-syntax/patch-postcss.js:30:73) at LazyResult.asyncTick (/Volumes/SSD/Projects/Purvis/Frontend/node_modules/postcss/lib/lazy-result.js:212:26) at LazyResult.asyncTick (/Volumes/SSD/Projects/Purvis/Frontend/node_modules/postcss/lib/lazy-result.js:225:14) at /Volumes/SSD/Projects/Purvis/Frontend/node_modules/postcss/lib/lazy-result.js:217:17
Last time i tried it everything seemed to work fine (a month or 2 ago) but i didn't finished it (had some PurgeCSS fixes first). This week i wanted to squeeze some extra performance out of my NuxtJS project (especially for mobile) so i picked this one up again but no luck because of the above error.
Probably i'm doing something wrong but i couldn't find anything in the issues (or closed ones) over here.
Related webpack config,
build: { // analyze: true, extend(config, ctx) {}, extractCSS: true, postcss: { plugins: { '@fullhuman/postcss-purgecss': { content: [ './pages/**/*.vue', './layouts/**/*.vue', './components/*.vue', './components/*/*.vue' // Subfolders also ], safelist: { standard: [ /body/, /btn/, /collapse/, /collapsed/, /form-control/, /input-group/, /page-item/, /page-link/, /pagination/, /tooltip/ ], greedy: [/custom-select/] } }, 'postcss-extract-media-query': { extractAll: true } } } }