vue-cli安装以及搭建vue项目详细步骤

1、第一步，检查node.js是否安装，通过命令提示符，node -v npm -v查看，如果没有请先安装node.js,如下图.

2、第二步，把npm换成cnpm，命令工具输入npm install -g cnpm --registry=https://registry.npm.taobao.org然后cnpm -v查看版本，如下图

3、第三步，全局安装webpack，使用命令工具输入cnpm install webpack 颍骈城茇-g。使用webpack -v查看版本如果webpack版本4以上，需要安装webpack-cli 依赖使用命令工具输入cnpm install webpack webpack-cli -g如下图

4、第四步，安装vue-cli使用命令工具输入cnpm install vue-cli -g使用vue -V（这个Ｖ大写），如下图

5、第五步，上面步骤安装完后，就可以利用vue-cli初始化vue项目在你想要安装项目的而目录下输入vue init webpack projectname（projectname是你项目的名称），Project name:——项目名称Project description:——项目描述Author:——作者Vue build:——构建模式，一般默认选择第一种Install vue-router?:——是否安装引入vue-router，这里选是，vue-router是路由组件,后面构建项目会用到Use ESLint to lint your code?:——这里强烈建议选no 否则你会非常痛苦，eslint的格式验证非常严格，多一个空格少一个空格都会报错，所以对于新手来说，一般不建议开启，会加大开发难度Setup unit tests with Karma + Mocha 以及Setup e2e tests with Nightwatch这两个是测试，可以不用安装如下图

6、第六步，选择上一张图片的NO,I will handle that myself然后输入cdprojectname(你项目名称)然后再输入cnpm install如下图

7、第七步，输入cnpm run dev最后在网址打开http://127.0.0.1:8080/如下图

8、最后附上项目的结构目录，如下图