使用Vue构建单页应用一

一、 环境准备

1 安装Node.js 最好安装node.js-6.X.X 以上版本，https://nodejs.org/en/ 我使用的是 v6.3.1 Current 版本。Node.js已经集成了包管理器NPM





下载安装包，安装完成后，打开一个命令窗口，可以输入如下命令查看安装版本。





2 安装 webpack

命令：

npm install webpack -g

官方安装教程：http://webpack.github.io/docs/installation.html

webpack 快速开始教程：http://webpack.github.io/docs/tutorials/getting-started/

3 安装Vue 官方提供的脚手架 vue-cli (在命令行工具里，执行如下命令)

命令：

npm install -g vue-cli

4 初始化应用 （每次新建项目时，从此命令开始，最好转到要新建项目的位置）

命令：

vue init webpack vue.web          这个命令执行时，会在当前路径下创建vue.web 的一个目录，所有资源文件都会放在改目录下

cd vue.web  // 进入项目目录

npm install // 安装依赖包

npm run dev // 启动服务

初始化完成后，打开浏览器，默认执行 127.0.0.1:8080  就可以访问了

（我本地8080 端口被占用了，所以就改为了8081，在config 目录下有一个index.js 文件，打开编辑port 值，改为你想要的。 改完后，重新 执行

命令： npm run dev   重启服务。

二、 开发Vue 单页应用

1  安装路由

命令： [code]npm install vue-router

[/code]

三、发布系统

1 发布命令：

npm run build

[/code]

[/code]