css-loader和style-loader

html-css013

css-loader和style-loader,第1张

1.开发环境安装css-loader

2.在webpack.config.js中引入css-loader(三种方法)

3.引入后npm run build,仍然无法显示样式,什么原因?

因为没有安装style-loader

1.开发环境安装style-loader

2.在webpack.config.js中引入style-loader

默认规则:引入的loader从下往上,从右往左扫描

3.引入css-loader和style-loader后npm run build,正常显示

作用

css-loader用于将css文件打包到js中, 常常配合style-loader一起使用,将css文件打包并插入到页面中。如下:

实现css类的作用域控制

默认情况下css文件中的类的作用, 第一种情况是不开启css-module模式