时间戳

首页 > 解决方案 > ValidationError：无效的选项对象。CSS Loader 已使用与 API 架构不匹配的选项对象进行初始化

javascript - ValidationError：无效的选项对象。CSS Loader 已使用与 API 架构不匹配的选项对象进行初始化

问题描述

我正在使用@zeit/next-css将 css 文件导入到我的组件和页面文件中，但它向我抛出了这个错误

./styles/navbar.css在我的组件中导入这个 css 文件，我navbar.js收到了这个错误

ValidationError: Invalid options object. CSS Loader has been initialised using
     an options object that does not match the API schema.
- options has an unknown property 'minimize'. These properties are valid:
   object { url?, import?, modules?, sourceMap?, importLoaders?, localsConvention?, onlyLocals? }

我next.config.js的放置在package.json哪里

const withCSS = require("@zeit/next-css");
module.exports = withCSS();

我的包 json

{
  "name": "transfer-to",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start"
  },
  "dependencies": {
    "@zeit/next-css": "^1.0.1",
    "isomorphic-unfetch": "^3.0.0",
    "next": "9.0.7",
    "react": "16.10.2",
    "react-dom": "16.10.2"
  }
}

标签： javascriptreactjsnext.js

解决方案

更新 css-loader 后我遇到了同样的问题，但我解决了。

如果您检查 css-loader 自述文件，那么我注意到“localIdentName”已移入模块键（可能不是最近的更改，只是我的工件是旧的）。我当前的工作配置是：

{
    loader: require.resolve('css-loader'),
    options: {
        importLoaders: 1,
        modules: true,
        modules : {
        localIdentName: '[name]__[local]__[hash:base64:5]',
        },
    },
},

旧的错误配置是：

{
    loader: "css-loader",
    options: {
        modules: true,
        localIdentName: "[name]__[local]___[hash:base64:5]",
        sourceMap: isDevelopment
    }
}

推荐阅读