环境:vue-cli 2.x(初版,后续会详解3.0) 、webpack4.x (3.x版本会有所不同可自行百度对应版本)
初始化:npm init
指令:npm i webpack vue vue-loader 可以指定版本
添加插件: npm install -D webpack-cli 、 npm i css-loader 、npm i vue-template-compiler 、
扩展插件: style-loader、file-loader、url-loader、node-sass、 sass-loader
build配置:
build 配置
mode配置
mode 配置【这个可去掉通过package.json配置】
对应可能出现异常解决方案:
1、vue-loader was used without the corresponding plugin. Make sure to include VueLoaderPlugin in your webpack config.
异常描述
解决: https://blog.csdn.net/cominglately/article/details/80555210 【webpack插件】
此时vue文件是可以被编译了
环境插件:webpack-dev-server、 cross-env
修改package.json
webpack.config.js
webpack.config.js
开发环境配置
注:这里有个巨坑 【端口 ,注意,注意 ,注意 端口被占用会抛出error,这里坑了很久】
抛出 配置
抛出配置
热加载:
hot 配置
扩展devServer:https://www.webpackjs.com/guides/development/#%E4%BD%BF%E7%94%A8-webpack-dev-server
目录:
目录
配置详情
index.js
package.json 配置
webpack.config.js 1
webpack.config.js2










网友评论