十分钟搭建vue2框架demo

一.准备

　　项目构建参考《前端实践项目 目录》，不推荐新手直接使用vue-cli。

二.安装

　　npm安装vue2。

npm install vue@2.6.11 --save

　　webpack编译时会识别不了.vue文件，所以需要安装相关插件。

npm install vue-loader@14.2.2 --save-dev

npm install vue-template-compiler@2.6.14 --save-dev

 三.代码

　　定义一个元素来挂载vue对象。

<div id="app"></div>

　　创建vue对象绑定到div上。

import Vue from 'vue'
import App from './test/App.vue'

new Vue({
  el: '#app',
  render: h => h(App)
})

　　App.vue组件。

<template>
  <div>hello world</div>
</template>
<script>
export default {
  components: {},
  data() {
    return {
    };
  },
  mounted() {},
  methods: {
  },
};
</script>

　　开启服务，就能在网页上看到hello world。