webpack 打包css问题

我在配置webpack的时候,关于css这块是这样设置的 loader: 'style-loader!css-loader?modules'

可以使不同模块之间的样式命名不会冲突,但是这样设置之后,我引入的外部css样式,就不被打包,不能显示了,请问是什么问题


拉风的咖菲猫
浏览 529回答 1
1回答

慕容森

将css分为需要打包的和不需要打包的,一般需要打包的css源文件都是预处理文件,比如以.less,.scss,.styl结尾的文件等等,可以对这部分需要打包的文件进行webpack配置,而对.css后缀的文件不作css module处理。示例:      {        test: /\.pcss$/,        use: [          'style-loader',          {            loader: 'css-loader',            options: {              camelCase: true,              importLoaders: 1,              localIdentName: '[path][name]---[local]---[hash:base64:5]',              modules: true,            },          },          {            loader: 'postcss-loader',            options: {              plugins: () => [                require('postcss-import')({                  path: path.join(baseDir, './src/style'),                }),                require('postcss-cssnext'),                require('postcss-nested'),                require('postcss-functions')({                  functions: {                    // any funcs you wanna                  },                }),              ],            },          },        ],      },      {        test: /\.css$/,        use: ExtractTextPlugin.extract({          fallback: 'style-loader',          use: [            'css-loader',          ],        }),      },
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript