NodeJs环境安装（windows）

学习Vue本身是不需要去学Node.js的，但是Vue-cli脚手架需要Node.js的环境支持和npm命令管理。
下载NodeJs：http://nodejs.cn/，安装完成后在cmd中，查看相应的版本，如果出现对应的版本号则表示环境安装成功，如果没有出现，则需要去环境变量Path中加上NodeJs的根目录。

E:\NodeJs\codeSpaces>node -v
v12.16.2

E:\NodeJs\codeSpaces>npm -v
6.14.4

npm和cpm的区别

• npm（node package manager）是nodejs的包管理器，用于node插件管理（包括安装，卸载，管理依赖等）
• cnpm：因为npm安装插件是从国外服务器下载，受网络影响较大，可能出现异常，所以淘宝团队分享了使用国内镜像来代替国外服务器
• 参数：
  -g：全局安装（global），可以在命令行下直接使用
  可以通过npm -root -g查看全局安装的文件夹位置
  -S，--save安装包信息将加入到dependencies（生产阶段的依赖）
  -D，--save-dev安装包信息将加入到devDependencies（开发阶段的依赖），所以一般开发阶段使用它
  i是install的缩写（注意：前面没有“-”）
• 
   

vue-cli2安装

cnpm/npm install -g vue-cli     -->    如果npm i -D vue-cli 失败，则执行npm init -f，然后再执行npm i -D vue-cli

临时从淘宝服务器获取镜像资源：npm install -g express --registry=http://registry.npm.taobao.org

永久设置为淘宝服务器获取镜像资源：npm config set registry http://registry.npm.taobao.org

安装cnpm（更多情况下，我们采用cnpm）

npm install -g cnpm --registry=https://registry.npm.taobao.org

• vue -V：查看vue的版本号

创建vue-cli2项目（采用webpack模板）

• Install vue-router？（Y/n）是否安装vue-router，这是官方的路由，大多数情况下都使用，这里就输入“y”后回车即可。
• Use EsLint to lint your code？（Y/n）是否使用ESLint管理代码，ESLint是个代码风格管理工具，是用来统一代码风格的，一般项目都会使用。

创建项目目录，用vue init webpack projectName 来创建项目，接下来便填写项目配置信息。

项目构建成功后，可以用npm run dev，进行启动。

卸载vue-cli2

cnpm/npm uninstall vue-cli -g   （如果安装的时候用的cnpm则卸载也要用cnpm）

安装vue-cli3

cnpm/npm install -g @vue/cli

命令创建项目

创建项目：vue create projectName

启动项目：cd projectName ，npm run serve

图形界面安装以及项目创建

1. 启动图形界面
   vue ui
   

   

2. 根据提示在浏览器上输入：http://localhost:8000，进入管理界面
   
    
3. 创建项目（根据图中的参数配置）