Antd css引入,样式无效

问题:

在 webpack 配置的时候,给 css 设置了 modules ,同时引入了 antd 的 css ,结果发现 antd 的样式无效

解决:

配置两次 css 匹配项,一次针对普通的文件,设置 modules 为 true ,而 node_modules 里的 css ,则不需要处理(因为 modules 默认false)

{//CSS处理
    test: /\.css$/,
    exclude: /node_modules/,
    use: [
        { loader: "style-loader", },
        {
            loader: "css-loader",
            options: {
                modules: true,
                importLoaders: 1,
                modules: {
                    //......
                },
            }
        },
        {
            loader: 'postcss-loader',
            options: {
                //......
            }
        },
    ]
},

{//antd样式处理
    test: /\.css$/,
    exclude: /src/,
    use: [
        { loader: "style-loader", },
        {
            loader: "css-loader",
            options: {
                importLoaders: 1
            }
        }
    ]
},