vue-cli脚手架搭建

一、环境的搭建：

1. 安装node.js，安装完成后，打开命令行工具(win+r，然后输入cmd)，输入 node -v，如下图，如果出现相应的版本号，则说明安装成功。

   
   
2. 安装淘宝镜像，打开命令行工具，把这个（npm install -g cnpm --registry= https://registry.npm.taobao.org）复制（这里要手动复制就是用鼠标右键那个，具体为啥不多解释），安装这里是因为我们用的npm的服务器是外国，有的时候我们安装“依赖”的时候很很慢很慢超级慢，所以就用这个cnpm来安装我们说需要的“依赖”。安装完成之后输入 cnpm -v，如下图，如果出现相应的版本号，则说明安装成功。
   
   补充：以上是我最开始接触vue的时候用的安装cnpm的方法，但后来不知道什么原因就失败了，后来的解决方案如下：

npm i -g cnpm

3. 安装webpack，打开命令行工具输入：npm install webpack -g，安装完成之后输入 webpack -v，如下图，如果出现相应的版本号，则说明安装成功。

   
   

二、我们需要准备的环境和工具都准备好了，接下来就开始使用vue-cli来构建项目：

1.先全局安装vue-cli

npm install -g vue-cli

安装完成之后输入 vue -V（注意这里是大写的“V”），如下图，如果出现相应的版本号，则说明安装成功。

2. 初始化项目

vue init webpack vue-demo

然后一路回车。

3. 运行vue环境

npm run dev

• vue 脚手架有时会出问题，报错 Error: No parser and no file path given

  原因：下载依赖包有bug

  解决方法：删除node_modules下的_prettier@1.13.0，执行cnpm install --save-dev prettier@1.12.0

• 使用vue-cli初始化项目时运行‘npm run dev’报错
  试一下 卸载npm uninstall webpack-dev-server，在安装这个npm i webpack-dev-server@2.9.7，我的可以正常启动了。

• 这个电脑上已经安装过vue环境后，下次再做新的vue项目，直接从“初始化项目”这步开始就行了~

查看搭建脚手架文档
这是我刚开始接触vue看的学习文档，跟着步骤能做出简单的项目例子