loader执行顺序从右到左,从下到上
1.同步loader
同步loader不能执行异步loader
2.异步loader
先执行异步的test2再执行test1
一、webpack-dev-serve是开发是实时编译更新
二、webpack处理样式
webpack默认不能对css进行打包,要使用css loader,style-loader将css文件插入到html,css-loader处理css文件之间的引用关系,postcss-loader是对不同浏览器的兼容,sass-loader是对.scss进行css转换
三、webpack处理图片
webpack是处理不了图片模块,
开发环境,file-loader将图片转换为dist目录里面
生产环境,将小图片转换为base64减少http请求,大图片不需要,防止渲染太慢
四、多入口
给不同的页面插入不同name的js文件
五、抽离css
在生产环境下,插入到html的css这种是不可取的,webpack引入以下插件进行压缩打包css和js
六、抽离公共代码 第三方库的代码不会变,应该抽离成一个文件,不要合并到其他文件里面,公共模块抽离成一个文件