vue起手式

我们在使用vue的时候有两个不同的版本，分别是完整版（vue.js）和非完整版（vue.runtime.js），接下来，我们来看一张总结图：

这张图总结了两个版本之间的区别，下面我们来详细讲一讲：

就是vue的完整版和非完整版

1.vue.js（同时包含编译器和运行时的版本）

2.vue.runtime.js（除去编译器的完整版）

建议从BootCDN引入vue.js即可。

template 和 render 怎么用 vue完整版template的使用，直接写到html里面，或者javascript上

<template>
    <div id="app">      
        {{n}}
        <button @click="add">+1</button>   
    </div> 
</template>

vue非完整版只能写到render里面

render(h){
  return h('div',[this.n,h('button',{on:{click:this.add}},'+1')])
},

那么这种方法推荐使用哪种呢？

推荐使用非完整版，需要配合vue-loader和vue文件 原因： 1.保证用户体验，用户下载的js文件体积更小，但支持h函数 2.保证开发体验，开发者可直接在vue文件里写html标签，而不写h 3.活让loader做，vue-loader 会把vue文件里的HTML转为h函数,这样我不用写太多麻烦的 h函数就可做到和完整版一样的事,还更节约文件大小,提升用户体验