安装Vue-cli（包含Node.js安装及环境配置之Windows篇）

一、Node.js的安装过程及环境配置如下面文档链接

https://blog.csdn.net/zhangkaidsy/article/details/86645070?utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromMachineLearnPai2%7Edefault-2.control&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromMachineLearnPai2%7Edefault-2.control

二、上面链接中的测试环节注意的问题

进行测试的前提：就是nodejs下载好并且环境变量也配置好了，就可以进行一下两步内容。
1.安装express模块
需要以管理员的身份输入下面命令：npm install express -g
安装成功！
打开E:\node.js\node_global\node_modules目录

发现已经安装好了，而这个位置就是我们在环境变量中配置的NODE_PATH的值！
2.补充 安装cnpm【此处也是需要用cmd的管理员权限】，这个的作用是加快下载的速度

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

三、vue-cli的安装

也是以管理员的身份输入：npm install -g @vue/cli
注意：如果之前安装过vue，先用命令 npm uninstall vue-cli -g 卸载它，然后 npm install -g @vue/cli 这个安装。
安装完后检查，出现版本号表示成功。（但这个安装的版本是Vue CLI >= 3 ）

四、拉取 2.x 模板 (旧版本)

Vue CLI >= 3 和旧版使用了相同的 vue 命令，所以 Vue CLI 2 (vue-cli) 被覆盖了。如果你仍然需要使用旧版本的 vue init 功能，你可以全局安装一个桥接工具：

npm install -g @vue/cli-init

（这行指令的意思是如果你要在3版本下去敲2版本的指令，你需要安装一个过渡的桥接工具）

创建项目的例子：

接下来就可以使用vue-cli2版本创建一个新的vue项目了。
语法：vue init 项目模板 项目名 （因为模板有很多种，webpack-simple是最基础的项目模板）

  vue  init   webpack-simple   heroes53     #创建一个名为heroes53的vue项目

1.创建一个空的文件夹“vue代码”；
2.把这个项目heroes53放到指定的位置(放在“vue代码这个文件夹中”)，则在命令行输入以下代码（不用管理员也可以）：

注意：？后面的内容如果要修改项目名的话可以直接修改，不修改的话就一路Enter，最后一项是是否使用Sass。
3.执行下面的命令需要以管理员的身份在命令行进行：

后面两个命令展示下面的内容表示成功：
然后弹出该页面

五、boostrap的安装

进入项目（heroes）文件所在的目录：npm i bootstrap@3.3.7
下载成功后在项目中node_modules中会出现一下内容：

六、添加路由模块