Webpack是怎么打包css文件的?(原始版)
2021-05-31 本文已影响0人
Gema玩家
(webpack所有的打包文件,都必须有依赖,没有跟页面有相关依赖的都会打包)
![](https://img.haomeiwen.com/i11976047/d2597a09af51ea91.jpg)
什么是loader?
Webpack不支持转化,比如es6转为es5,将scss,less转成css,将.jsx, .vue文件转成js文件等等。此时使用loader。
Loader使用过程:
-
通过npm安装使用的loader
-
在webpack.config.js中的modules关键字下进行配置。
![](https://img.haomeiwen.com/i11976047/392f78ac280eed96.jpg)
注意:css-loader只负责打包加载,不负责告诉浏览器渲染,此时需要引入style-loader。
Style-loader负责将样式添加到dom中,使用多个loader时,顺序是从右往左进行。