目的： 记录使用npm安装方式 安装Vue.js的过程，方便参考和借阅

 

No 1. 安装Node.js （如果电脑上已经安装了npm环境的同学，就不用再次安装，可以跳过此步骤 直接到No.2）

    1.1 进入到右边的网页地址 https://nodejs.org/en/ 

     1.2 进入之后，点击下载（download） 

     1.3 选LTS版本的：这是稳健版的。

会自动根据电脑配置下对应的版本号。

下载完成后，点击安装文件

这个安装程序，写的非常好。
最关键的是，如果对之前的哪一步不满意，就直接点击back就返回了，不用太担心。

一般来说，直接默认往下走就好了，在destination folder那，可以选择自己喜欢的安装目录。

之后就可以使用了。

效果如下：

(注：命令窗口中要切换到node.js安装目录下再执行npm命令，否则要配置环境变量,配置环境变量可参考博客：https://blog.csdn.net/qq_29712995/article/details/79094433 )

 

 

No 2. 使用Npm安装Vue.js

        2.1 由于 npm 安装速度慢，本教程使用了淘宝的镜像及其命令 cnpm，安装使用介绍参照：使用淘宝 NPM 镜像。

        2.2 在用 Vue.js 构建大型应用时推荐使用 NPM 安装：

               # 最新稳定版

              $ cnpm install vue

        2.3 完成安装

 

No 3.  命令行工具

             3.1 命令行构建 ( Vue.js 提供一个官方命令行工具，可用于快速搭建大型单页应用。 )

# 全局安装 vue-cli
$ cnpm install --global vue-cli
# 创建一个基于 webpack 模板的新项目
$ vue init webpack my-project
# 这里需要进行一些配置，默认回车即可
This will install Vue 2.x version of the template.

For Vue 1.x use: vue init webpack#1.0 my-project
? Project name myproject
? Project description xxxxxxxx
? Author chenjunzhen
? Vue build standalone
? Install vue-router? Yes
? Use ESLint to lint your code? No
? Set up unit tests No
? Setup e2e tests with Nightwatch? No
? Should we run `npm install` for you after the project has been created? (recommended) npm

   vue-cli · Generated "myproject".


# Installing project dependencies ...
# ========================

npm WARN deprecated browserslist@2.11.3: Browserslist 2 could fail on reading Browserslist >3.0 config used in other tools.
npm WARN deprecated bfj-node4@5.3.1: Switch to the `bfj` package for fixes and new features!
npm WARN deprecated browserslist@1.7.7: Browserslist 2 could fail on reading Browserslist >3.0 config used in other tools.

> uglifyjs-webpack-plugin@0.4.6 postinstall E:\workHouse\cjz\前端学习\Vue\2018-09-25\vue\myproject\node_modules\webpack\node_modules\uglifyjs-webpack-plugin
> node lib/post_install.js

npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN ajv-keywords@3.2.0 requires a peer of ajv@^6.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

added 1132 packages from 656 contributors and audited 10615 packages in 178.578s
found 1 moderate severity vulnerability
  run `npm audit fix` to fix them, or `npm audit` for details

# Project initialization finished!
# ========================

To get started:

  cd myproject
  npm run dev

Documentation can be found at https://vuejs-templates.github.io/webpack

(PS : 

在安装时会询问你，①、Project name (sanfeng1)；项目名称（sanfeng1）。（确定按enter，否按N）

　　　　　　　　　　　　　②、 Project description (A Vue.js project)；项目描述（一vue.js项目）。（随意输入一段简短介绍，用英文）

　　　　　　　　　　　　　③、Author (sunsanfeng)；作者（sunsanfeng）。（确定按enter，否按N）

　　　　　　　　　　　　　④、Vue build (Use arrow keys)> Runtime + Compiler: recommended for most usersRuntime-only: about 6KB lighter min+gzip, but templates (or any Vue-specificHTML) are ONLY allowed in .vue files - render 　　　　　　　　functions are required elsewhere；Vue公司的建立（使用箭头键）>运行时+编译器：大多数用户推荐运行时间：约6kb轻民+ gzip，但模板（或任何Vue具体HTML）只允许在。VUE文件渲染功能是必需的其他地方。（按enter）

　　　　　　　　　　 　　⑤、Install vue-router? (Y/n)；安装的路由？（/ N）。（可安可不安，以后也可以再安，根据需求选择）

　　　　　　　　　　　　⑥、Use ESLint to lint your code? (Y/n)；使用ESlint语法？（Y/ N）。（使用ESLint语法，就要做好心理准备，除非你非常懂ESLint语法，要不就会处处报错，我就被逼疯过，建议N）

　　　　　　　　　　　　⑦、Setup unit tests with Karma + Mocha? (Y/n)；设置单元测试？（Y / N）。（选N）

　　　　　　　　　　　　⑧、Setup e2e tests with Nightwatch? (Y/n)；Nightwatch建立端到端的测试？（Y / N）。（选N）

 

•                                     最后一个选项是推荐相关依赖后续使用npm install指令安装，选择Yes, use npm

)

                   3.2   进入项目，安装并运行：

$ cd my-project
$ cnpm install
$ cnpm run dev
 DONE  Compiled successfully in 4388ms

> Listening at http://localhost:8080

                  3.3   成功执行以上命令后访问 http://localhost:8080/，输出结果如下所示：

注意：Vue.js 不支持 IE8 及其以下 IE 版本。