vue

webpack

webpack是近期最火的一款模块加载器兼打包工具，它能把各种资源，例如JS（含JSX）、coffee、样式（含less/sass）、图片等都作为模块来使用和处理。

MVVM

<!-- 这是我们的 View -->
<div id="example-1">
  Hello !
</div>

// 这是我们的 Model
var exampleData = {
  name: 'Vue.js'
}

// 创建一个 Vue 实例或 "ViewModel"
// 它连接 View 与 Model
var exampleVM = new Vue({
  el: '#example-1',
  data: exampleData
})

使用

安装淘宝镜像

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

cnpm install webpack -g
安装vue脚手架

npm install vue-cli -g

vue init webpack-simple 工程名字<工程名字不能用中文>

npm install

语法

v-bind 属性与数据绑定

v-if

v-for

v-on

监听事件

v-model

生命周期

run

这一行命令代表着它会去找到package.json的scripts对象，执行node bulid/dev-server.js。在这文件里，配置了Webpack，会让它去编译项目文件，并且运行服务器，我们在localhost:8080即可查看我们的应用

引入jquery

修改build文件夹下面的webpack.base.conf.js文件，

var webpack = require('webpack')

加入
plugins: [
  new webpack.ProvidePlugin({
    $: "jquery",
    jQuery: "jquery",
    "windows.jQuery": "jquery"
  })
],


alias: {
  'jquery': path.resolve(__dirname, '../src/assets/scripts/jquery.min')
}