第一步:基础三大件
1、webpack(打包配置)
2、webpack-cli(脚手架)
3、webpack-dev-server (实时编译)
第二步:编译转换六件套
处理JS -> ES6 ES7 ES8 装饰器
//转换成ES6
babel-loader@7(由于版本8和babel-core 不兼容,所以用版本7)
babel-core
babel-preset-env
//转换成ES7 ES8
babel-plugin-transform-runtime
//转换装饰器
babel-plugin-transform-decorators
babel-plugin-transform-decorators-legacy
第三步:样式处理四大件
处理sass -> css -> style(放入html内部style位置)
//sass
sass-loader
node-sass
//css
css-loader
//css3 根据不同浏览器自动补齐前缀(可配置)
postcss-loader autoprefixer
//style
style-loader
第四步:处理模版
ejs-loader
第五步:处理HTML
html-webpack-plugin
网友评论