Vue.js入门 - 安装

说明：由于本人使用Mac，下文中步骤对于windows可能无效，请自行参见官方教程。
官网：http://vuejs.org/
教程（中文）：http://cn.vuejs.org/v2/guide/installation.html

引用于官网

• 在用 Vue.js 构建大型应用时推荐使用 NPM 安装， NPM 能很好地和诸如 Webpack 或 Browserify模块打包器配合使用。 Vue.js 也提供配套工具来开发单文件组件。

• Vue.js提供一个官方命令行工具，可用于快速搭建大型单页应用。该工具提供开箱即用的构建工具配置，带来现代化的前端开发流程。只需几分钟即可创建并启动一个带热重载、保存时静态检查以及可用于生产环境的构建配置的项目

下面我们使用命令行工具进行创建。

1. Node版本

需要Node版本在4.0.0以上。若有权限问题请在命令前加sudo

[1] 查看版本
node -v

[2] 安装一个叫n的模块
npm install -g n

[3] 升级
n stable

2. 安装cnpm替换npm（可选）

在国内使用npm下载很慢，推荐使用淘宝的npm镜像，安装cnpm，以后在使用npm的地方替换成cnpm就可以了。

淘宝镜像地址：https://npm.taobao.org/

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

3. 全局安装 vue-cli

npm install --global vue-cli

4. 创建一个基于 webpack 模板的新项目

vue init webpack my-project
注意：my-project是项目名称，可以自定义

? Project name my-project
? Project description An example to introduce vuejs
? Author joyce
? Vue build standalone
? Install vue-router? Yes
//-语法检查工具-
? Use ESLint to lint your code? No
? Setup unit tests with Karma + Mocha? No
? Setup e2e tests with Nightwatch? No

5. 安装依赖

进入创建的工程目录（需和上述可自定义的项目名称一致）进行安装

cd my-project

npm install

可以在项目目录里直接安装，是因为有package.json这个文件，里面包含了需要安装的包的名称。安装完成后，可以在目录中发现多出了node_modules这个文件夹，里面为下载的依赖。

6. 运行

npm run dev
在上述的package.json中有”dev”: “node build/dev-server.js”，实际运行的是这个js，默认是在8080端口。