一、Vuejs简介

Vue.js - Intuitive, Fast and Composable MVVM for building interactive interfaces.

vue.js是一个用于构建交互式界面的直观、快速和可组合的MVVM框架。易用，只要你会前端开发的“三大件”就可以阅读文档开始用vue.js构建应用；灵活，简单小巧的核心，渐进式技术栈，足以应付任何规模的应用；性能，17kb min+gzip的运行大小，

超快虚拟DOM，最省心的优化。

vue.js的兼容性

Vue.js 不支持 及其以下版本，因为 Vue.js 使用了 IE8 不能模拟的 ECMAScript 5 特性。 Vue.js 支持所有兼容 ECMAScript 5 的浏览器。

Vue.js 内部使用 ES5 的 Object.defineProperty 来转化对象属性为 getter 和 setter，并在 getter 和 setter 中 emit 事件来实现对对象属性变化的观察。这是 Vue.js 简洁的语法和强劲的性能的基础。IE8 的该方法不能作用于 JS 对象，也没有办法模拟。

vue.js的组件

一个.vue文件由html、js、css三部分组成，分别体现为3个标签：<template></template>、<script></script>、<style></style>。

vue.js的入门项目

todolist

卖座网

二、vue.js环境搭建及脚手架工具

可以使用NPM安装

#最新稳定版本npm install vue#最新稳定 CSP兼容版本npm install vue@csp

node.exe下载地址

git.exe下载地址

#git安装git clone https://github.com/vuejs/vue.git node_modules/vuecd node_modules/vuenpm installnpm run build

（不推荐使用，除非网速实在太慢；因为有些依赖的包下载不完全）

#使用淘宝定制的 cnpm (gzip 压缩支持) 命令行工具代替默认的 npm$ npm install -g cnpm --registry=https://registry.npm.taobao.org

官方命令行工具--vue-cli

# 全局安装 vue-clinpm install --global vue-cli#创建一个基于 webpack 模板的新项目vue init webpack my-project#切换到项目安装依赖，走你cd my-projectnpm installnpm run dev

安装过程中的提示了解package.json文件-devDependencies下为项目依赖的包，其中一系列babel包用来解析[ES6](http://es6.ruanyifeng.com/)了解webpack-修改默认端口8080，在webpack.config.js文件中的devServer 添加 port:新端口号了解vue.js基本项目结构及主要文件-使用webpack-simple模板：    myproject    -node——moudles    +src        +assets            -logo.png        -App.vue        -main.js    -.babelrc    -.gitignore    -index.html    -package.json    -README.md    -webpack.config.js了解vue.js组件的重要选项：data、methods(this)、watch(监听 val oldval)了解vue.js的模板指令：- 数据渲染 v-html v-text {
   {}}- 模板控制指令 v-if v-show- 渲染循环列表 v-for - 事件绑定  v-on @  - 属性绑定 v-bind   了解 es6

v-text 与v-html的不同（看文档）v-for的使用 （尤其怎么遍历双重数据）v-bind

---

踩过的坑：

1、npm install的时候，显示有一个错误：node-sass安装失败；尝试了好几次还是失败，解决方案：用cnpm安装（已经是迫不得已了！）

友情链接

1. vue.js官方资料:、

2. vue案例：、