Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Module build failed (from ./node_modules/postcss-loader/dist/cjs.js): ValidationError: Invalid options object. PostCSS Loader has been initialized using an options object that does not match the API schema. #365

Open
meowwww88hen opened this issue Jan 8, 2022 · 7 comments

Comments

@meowwww88hen
Copy link

Screenshot 2022-01-08 at 3 43 37 PM

有人遇到同样的问题吗?
@bayuec
Copy link

bayuec commented Jan 14, 2022

一样的问题

@lazy1523
Copy link

me too

@crzyjcky
Copy link

After spending more than a week to fix the error (I almost give up), I found the solution here:
arackaf/customize-cra#315 (comment)

TLDR - add the following lines in config-overrides.js:

const { override, fixBabelImports, addLessLoader, adjustStyleLoaders } = require('customize-cra');

module.exports = override(
  // Load antd
  fixBabelImports('import', { ... }),

  // Add `javascriptEnabled` and antd theme configuration
  // to the Less loader
  addLessLoader({ ... }),

  adjustStyleLoaders(({ use: [, , postcss] }) => {
    const postcssOptions = postcss.options;
    postcss.options = { postcssOptions };
  })
);

@RuotongX
Copy link

After spending more than a week to fix the error (I almost give up), I found the solution here: arackaf/customize-cra#315 (comment)

TLDR - add the following lines in config-overrides.js:

const { override, fixBabelImports, addLessLoader, adjustStyleLoaders } = require('customize-cra');

module.exports = override(
  // Load antd
  fixBabelImports('import', { ... }),

  // Add `javascriptEnabled` and antd theme configuration
  // to the Less loader
  addLessLoader({ ... }),

  adjustStyleLoaders(({ use: [, , postcss] }) => {
    const postcssOptions = postcss.options;
    postcss.options = { postcssOptions };
  })
);

This works for me! Thanks, dude, it is a very helpful answer.

@Jot4ril
Copy link

Jot4ril commented Aug 26, 2022

Guys, please I'm new to coding and don't know how to implement this in my code. Please can anyone help me further

@Nero978
Copy link

Nero978 commented Jan 31, 2023

After spending more than a week to fix the error (I almost give up), I found the solution here: arackaf/customize-cra#315 (comment)

TLDR - add the following lines in config-overrides.js:

const { override, fixBabelImports, addLessLoader, adjustStyleLoaders } = require('customize-cra');

module.exports = override(
  // Load antd
  fixBabelImports('import', { ... }),

  // Add `javascriptEnabled` and antd theme configuration
  // to the Less loader
  addLessLoader({ ... }),

  adjustStyleLoaders(({ use: [, , postcss] }) => {
    const postcssOptions = postcss.options;
    postcss.options = { postcssOptions };
  })
);

It's very useful!! Thanks for your help!

@cj348986512
Copy link

encountered same problem, after I deleted below config in vue.config.js, it worked:
css: {,
loaderOptions: {
postcss: {
plugins: [
require("postcss-pxtorem")({
rootValue: 14,
propList: ["*"],
}),
],
},
},
},

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

8 participants