webpack默认打包js部分,其它非js模块默认处理不了
如下引入css文件打包报错,webpack处理不了需要加载器才可以
配置打包css文件
配置打包less文件
编写less文件
引入less文件
打包生成bungle.js
配置打包scss文件
注意红框
编写scss文件
导入
自动添加postCSS自动兼容前缀
新建postcss.config.css
webpack.config.css
打包图片和字体文件
比如加载背景图片
报错
打包图片和字体文件基本使用
图片大小等于limit大小,将变成图片路径,否则转换成base64
配置babel处理高级语法
如下语句:
报错,webpack处理不了高级语法
处理如下:
配置vue组件的加载器
引入vue单文件
报错:
处理如下:
配置如图:
在webpack中使用vue
设置:
webpack打包发布
运行npm run build执行webpack -p命令,此时就会读取webpack.config.js文件,读取打包操作命令
webpack.config.js 生成dist目录
将dist文件交予后台开发人员进行服务器上线就可。
成功运行!