通过webpack构建vue初始化项目

1.安装node，这个是肯定要安装的

2.安装vue脚手架构建工具，命令行输入 

npm install –g @vue/cli

3.安装webpack

通过 npm 或者 cnpm 安装webpack模块化打包工具

npm install webpack –g

或

cnpm install webpack –g

4.初始化 webpack 项目，执行命令：

vue init webpack 123app

其中 123app 是我们要建立的项目的名称，当脚本执行时会进行确认

---

安装依赖，如下所示：

---

 

 Project name 123app 填写你定义的项目名称  (可以不填直接敲回车)

 Project description  填写对项目的描述        

 Author填写作者名

选择第一个按回车   就会出现：Vue build standalone

 Install vue-router? 是否安装vue-router        Yes

Use ESLint to lint your code? 是否用ESLint          No

 Set up unit tests  是否建立Unit单元测试         No

 Setup e2e tests with Nightwatch?         是否E2E黑盒测试     No

我们是否应该在项目创建后为您运行“npm安装”？（推荐）（使用箭头键） 

Yes，use NPM

---

说明：

ESLint的作用是检查代码错误和统一代码风格的。确认添加ESLint后，在创建的项目中就会出现.eslintignore和.eslintrc.js两个文件。

eslintignore类似Git的.gitignore用来忽略一些文件不使用ESLint检查。

eslintrc.js是ESLint配置文件，用来设置插件、自定义规则、解析器等配置。

Karma是一个基于Node.js的JavaScript测试执行过程管理工具（Test Runner）。该工具在Vue中的主要作用是将项目运行在各种主流Web浏览器进行测试。

Mocha是一个测试框架，在vue-cli中实现单元测试。

---

启动项目：

执行初始化项目以后，下面会有对应的命令：

已经初始化了项目，并且在 package.json 里面已经有相关配置，所以在这里可以直接安装；

安装完成之后再执行命令： npm run dev

整个项目就已经启动了：

npm run dev   运行

npm run build 打包