初识vue 2.0（1）：环境部署

0，背景：零基础，准备使用vue.js做一个10个页面左右的H5应用。  ^_^

1，在window7环境下安装node.js，当前最新版本为 node-v6.11.0，自行设置global目录及代理等。

2，安装完成后，使用npm安装vue及webpack，vue的版本为 2.3.3。

npm install -g vue
npm install -g webpack

3，安装脚手架：vue-cli。

npm install -g vue-cli

4，基础工作完成，开始创建项目，项目名称为：myapp，进入开发目录进行如下操作：

vue init webpack-simple myapp

如果下载模版网络不通畅，可以将webpack-simple模版下载到开发目录，然后指定模版路径来创建项目：

vue init ./webpack-simple myapp

5，创建项目完成，安装依赖：

cd myapp 
npm install

此时项目目录中生成了index.html文件及一个src目录，index.html为项目的入口文件，src为我们的开发目录，基本上要做的事情都在这个目录里，里面包含了如下几个目录及文件：

assets: 放置一些图片，如logo等。
App.vue: 项目入口文件。
main.js: 项目的核心文件。

App.vue 主要包含三部分内容，此处不展开，后续会详细讲解。

template：模版
script：脚本
style：样式

6，根据提示，在开发模式下运行一下：

npm run dev

node提供了web server，可以通过localhost:8080来访问。

7，如果需要发布上线，则：

npm run build

此时生成纯前端页面，可以通过nginx/apache等web server访问index.html

 

下一篇会讲一下vue2.0的路由和组件。