vue初使用及安装

vue初使用及安装

一：安装Node.js

1. 在Node.js官网https://nodejs.org/en/download/下载安装包。
2. 下载后进行安装。
3. 打开命令行，输入node -v可以查看到版本号。输入npm –v可看到npm版本号。新版的Node.js已自带npm（类似.net中的nuget包管理器），安装Node.js时会一起安装。（将来要更新npm可用这个命令npm intall npm@latest -g）
4. 配置环境变量（这里就会自动配置好）。
5. 命令行中输入node， 再输入console.log("hello"); 用来验证是否安装成功。
6. 配置npm的全局模块的存放路径和缓存路径，在node.js的安装目录下新建node-cache和node_global两个文件夹，然后命令行输入：

   npm config set prefix "c:\Program Files\nodejs\node_global"
   npm config set cache "c:\Program Files\nodejs\node_cache"

   将来用npm install xxx -g 安装以后的模块就在这两个文件夹里。
7. 配置npm的环境变量：系统变量path中新增一个变量：
   C:\Program Files\nodejs\node_global\node_modules，（node安装在哪就写哪），然后在用户变量中修改变量为C:\Program Files\nodejs\node_global，最后就可以删掉C:\Users\xlz\AppData\Roaming下的npm目录了。

二：安装cnpm

1. 输入命令：cnpm install， 完成后在C:\Program Files\nodejs\node_global\node_modules目录下可看到cnpm文件夹和它的文件了。

三：安装webpack（js应用程序的静态模块打包器module bundler）

1. 输入 cnpm install webpack -g 进行安装，如何报错则去掉-g。

四：安装vue-cli（用来生成vue模板的工具）

1. 输入cnpm install vue-cli -g 进行安装。

五：新建一个Vue项目测试一下

1. 1. 在某个盘新建一个文件夹，命令行输入vue init webpack xxx（项目名）进行创建，按下enter键进行多次确认，最后一步选No.
   2. cd xxx（项目名）,即进入所创建的项目中。
   3. 输入 cnpm install下载安装项目的依赖。
   4. 输入cnpm run dev ，然后在浏览器通过http://localhost:8080地址访问。