执行顺序问题
来源:3-3 使用 Loader 打包静态资源(样式篇 - 上)
梦无涯1978
2019-02-27
请问老师,这一小节执行打包命令后的执行流程,我下面的理解大概对吗?
执行的大概流程:
- 执行打包命令
- webpack匹配到scss样式文件
- 借助sass-loader打包
- 打包好的scss样式转给css-loader转译
- 转好的样式交给postcss-loader并借助autoprefixer插件自动添加相应的厂商前缀
- 添加好前缀的样式转给style-loader挂载到dom上的style里
写回答
3回答
-
理解的很正确
022019-02-28 -
脑阔疼
2019-02-28
执行打包命令
webpack匹配到scss样式文件 (test:/\.scss$/ 匹配到样式文件)
借助sass-loader打包 (解析成 css)
将sass-loader处理过的css样式转给post-loader转译 (css加浏览器前缀等, postcss 支持比较新的样式书写方法 比如 花括号嵌套等,所以可以放在sass-loader前面 )
加好前缀的样式转给css-loader转译 (@import 处理配置) 输出css代码
css代码转给style-loader挂载到dom上的style里 (将css代码挂载到页面,是<style></style>标签形式挂载到页面里,而不是dom的style属性。)
20 -
脑阔疼
2019-02-28
loader 顺序在官网找到了一个代码片段 可以看到是先处理 sass00
相似问题