Ошибка в пост css загрузчике с webpack 3

Question

Я использую загрузчик css с загрузчиком post css в webpack 3 в угловом проекте. Когда я создаю свое приложение, я получаю следующие ошибки для всех моих файлов CSS:

    ERROR in ./node_modules/css-loader!./node_modules/postcss-loader/lib!./src/XXX/XXX/xxx.css
Module build failed: TypeError: WeakMap: incorrect invocation!
at TypeError (native)
at module.exports (/home/anil/projects/expertly/client/webapp/node_modules/core-js/modules/_an-instance.js:3:11)
at /home/anil/projects/expertly/client/webapp/node_modules/core-js/modules/_collection.js:59:9
at new WeakMap (/home/anil/projects/expertly/client/webapp/node_modules/core-js/modules/es6.weak-map.js:17:12)
at e (/home/anil/projects/expertly/client/webapp/node_modules/@std/esm/index.js:1:36380)
at Object.<anonymous> (/home/anil/projects/expertly/client/webapp/node_modules/@std/esm/index.js:1:27033)
at e (/home/anil/projects/expertly/client/webapp/node_modules/@std/esm/index.js:1:129)
at Object.module.exports.Object.defineProperty.value (/home/anil/projects/expertly/client/webapp/node_modules/@std/esm/index.js:1:40119)
at e (/home/anil/projects/expertly/client/webapp/node_modules/@std/esm/index.js:1:129)
at Object.<anonymous> (/home/anil/projects/expertly/client/webapp/node_modules/@std/esm/index.js:1:149384)
at e (/home/anil/projects/expertly/client/webapp/node_modules/@std/esm/index.js:1:129)
at /home/anil/projects/expertly/client/webapp/node_modules/@std/esm/index.js:1:486
at /home/anil/projects/expertly/client/webapp/node_modules/@std/esm/index.js:1:497
at makeLoaderFunction (/home/anil/projects/expertly/client/webapp/node_modules/@std/esm/index.js:36:3)
at Object.<anonymous> (/home/anil/projects/expertly/client/webapp/node_modules/@std/esm/index.js:40:16)
at Module._compile (module.js:541:32)
at Object.Module._extensions..js (module.js:550:10)
at Module.load (/home/anil/projects/expertly/client/webapp/node_modules/coffee-script/lib/coffee-script/register.js:45:36)

Это мой конфиг веб-пакета для загрузчика css:

  {
      test: /\.css$/,
      use: [
        'to-string-loader',
        { loader: 'css-loader' },
        'postcss-loader' 
      ],
      exclude: [
        path.join(__dirname, "../node_modules"),
      ]
    }

postcss.config.js:

module.exports = {
  plugins: {
  'autoprefixer': { browsers: 'last 2 versions' },
  'cssnano': {
    safe: true,
    sourcemap: true,
    autoprefixer: false
  },
  'postcss-import': {
    addDependencyTo: webpack
  },
  'postcss-cssnext': {}
  }
}

Используются следующие версии:

"postcss-loader": "2.0.7"

"webpack": "3.6.0"

Answer 1

PostCSS и Webpack

Извините за мои слова, но ваши конфигурации имеют критические проблемы, я React Разработчик, но Webpack конфиги не зависят от Angular или же React или что-то еще, но почему у вас нет fallback внутри вашего rules?

Почему вы не используете ExtractTextPlugin? и почему вы используете CSS расширение файла, когда вы хотите поиграть с PostCSS? и другие вещи, как разделенные PostCSS файл? Зачем?

Я предлагаю вам увидеть мою конфигурацию PostCSS в Webpack и сравнить ее с вашими конфигами, моя стандартная работа потрясающая, она использует реакцию, не говоря уже о Webpack версия 3.x а также PostCSS версия 6.0.x а также postcss-loader версия 2.0.x, И специально я разделяю версию разработки и производства Webpack, это легко понять и очистить. если у вас есть другие вопросы, пожалуйста, задавайте, я буду рад ответить.