vue 核心知识点1--环境配置篇

环境：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

vue 核心知识点- 开发配置2