1.下载安装webpack
2.项目中创建webpack.config.js const path=require('path') moudle.exports={ entry:'./src/main.js' //入口文件 output:{ //打包后文件位置 path:path.reslove(_dirname,dist) filename:'demo.js' } }
3.引入babel.babel将ES6的语法转为ES5。
moudle:{rules:[{ test:/|.js$/ loader:"babel-loader" exclude:/node-moudles/}]}
正则: . 匹配除unicode和换行符之外的字符 $ 匹配以此结尾的。 \表示下一字符标记为特殊字符,文本,反向引用或八进制转义符。
4.css 加载器 css-loader,style-loader {test:/|.css$/,loader:"css-loader"}
5.图片资源加载 file-loader,url-loader 6.生产环境 plugins:[ new webpack.DefinePlugin({
'process-env':{node-env:‘ “ production” ’} })]