安装node
根据不同的系统安装node环境
全局安装webpack和vue-cli
npm install webpack -g
npm install vue-cli -g
选取要创建项目的目录
cd Document/demo
以上是我要创建webpack+vue项目的目录,你可以选取你想要存放的目录
创建项目
vue init webpack webpack-vue1
webpack-vue1为项目名称,执行上述命令后会出现如下页面,有一些基本设置项,如果不明白是什么意思,一直回车就可以,会按照默认项设置。
这个过程可能需要2-3分钟的时间,请耐心等待,出现如下页面,即创建项目成功
创建好的项目目录结构如下:
进入项目目录
cd webpack-vue1
运行项目
npm run dev
在浏览器中输入 http://localhost:8080 打开项目
其他注意事项
安装过程中,会提示 是否使用eslint,eslint算是一个代码语法规范检查的工具,不同意就不会把检查语法规范的功能加进webpack编译的流程里。个人建议是选择n 这样避免了很多格式错误,如果在创建项目的时候你选择了yes,也没有关系,我们可以在项目中修改为不检查
找到 build/webpack.base.conf.js
注释掉下图中红色框中的部分