vue.js入门学习（搭建环境和测试demo）
什么是vue.js?这是官网的解释。
Vue.js（读音 /vjuː/，类似于 view） 是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层，它不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与单文件组件和 Vue 生态系统支持的库结合使用时，Vue 也完全能够为复杂的单页应用程序提供驱动。
做为一个服务端开发者初学前端框架有些懵，定义很难理解，得了，那就先做出点可见的东西吧。本文就是搭环境和做一个测试demo,操作都是在windows命令窗口下进行的。
1.安装Node.js，node.js安装包及源码下载地址为：https://nodejs.org/en/download/。
node --version， 测试是否安装成功，如图，出现版本号就是成功了
2.npm的安装，其实新版本的node已经集成了npm，所以安装成功node，就不用管这步了，为了保险，我们也测试下是否安装成功
3.执行 npm install -g cnpm --registry=https://registry.npm.taobao.org；
我们做项目肯定要一些基础的包，就如java中引用jdk或者别人开发好的jar包，而现在我们绝不会浪费时间去搜索，下载。就如同maven一样，vue.js只要从网站下载就可以了，由于默认的npm链接的是国外的网站，速度慢，有的根本下载不成功，我们执行这条命令就可以直接执行 ”cnpm 包名称”， 从国内淘宝镜像下载，速度快，当然您也可以npm 包名称，直接从国外的地址下载。
4. npm install -g vue-cli
这是安装安装vue-cil，vue-cil是vue的脚手架工具。构建vue项目用的。
到这里，vue的基本环境就可以了。
我们进入想创建vue项目的地址，我这里是d盘 vue文件夹下，执行vue init webpack vuetest，vuetest是
我的项目名字，注意，不能有大写字母 。执行过程中会有几个选项，回车就行了。
注意，到了Use ESLint to lint your code? (Y/n) 这个选项处，最好选n，如果选y，项目检查你代码时，
会把排版缩进不规范都算错误。如图，
这是完成后
大家看到上图，已经提醒我们怎么做了，那就是cd vuetest，进入项目目录，
下载需要的包，这个搭环境时提过用cnpm install，这个要费点时间，耐心等待下载完成就可以了
npm run dev是启动项目。这三步我就不截图了，执行npm run dev后，不用干别的，浏览器会自动启动 ，如图
这样，我们基本的一个项目就成功了。我们可以用webstorm（一个前端开发idea）打开这个项目看看。
好了，这样我们的基本开发环境就搭建完毕了，以后我们专注开发就可以了。像我这种入门级的开发就在src这个文件夹下开发就可以了。
我们打开app.vue,这个vue模板就是我们刚才看到展示页面的主要组成部分，如果你的webstorm最底部出现这个
可以如图这么做，选择node_modeles右键，如图就可以了
我们看src文件夹，下几个文件，
assets是放静态文件的，
components就放.vue文件的，也就是我们要开发的模板文件，
router下的index.js是控制路由跳转的，也就是配置哪个名字跳转哪个模板。不懂以后随着做项目就懂了。
app.vue和main.js启动时加载的。
我们主要开发就是在components这个文件夹下。打开新建项目自带的hello.vue我们看下
看看其实就是html和js还有css。只不过js和html有一个响应式的连通。js里定义了msg（图一）变量，
在这个页面中html通过两个大括号引用它（图二），
这样，通过这个msg变量，js和html就动态的连通了，通过js改变msg的值，html也会跟着自动改变，
这就是所谓的响应式。比jquery要高级吧？jquery还要通过选择器找到元素去改变它。
图一
图二
现在我们的msg 定义是Welcome to Your Vue.js App（图一），所以初始页面也是这个（启动时初始页面，上面我已截图了）。
我们把它改成hello world，如图