vue两个版本的区别和具体使用方法

两个版本对应的文件名

vue.js（完整版）和 vue.runtime.js（非完整版）

两者区别：

最佳实战：应该总是使用非完整版本，然后配合vue-loader和vue文件

具体思路： 1。 保证用户体验，用户下载的JS文件体积更小，但只支持h函数 2。 保证开发体验，开发者可直接在vue 文件里写 HTML标签，而不写h函数 3。 脏活让 loader 做，vue-loader把 vue 文件里的HTML 转为h函数 对比 如果vue.js错用成vue.runtime.js：无法将HTML编译成视图； 如果vue.runtime.js错用成vue.js：代码体积变大，因为vue.js有编译HTML的功能。

template 和 render 怎么用？

vue完整版 template的使用方法：直接写在html上或者js上

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

vue非完整版 render的使用方法： render函数接收一个参数h，这个参数是vue传的；用这个参数去创建实例

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

如何用 codesandbox.io 写 Vue 代码

1、进入 codesandbox.io （建议不要登录，否者只能创建50个项目）； 2、选择vue项目选项；

3、稍等一下即可生成一个vue项目

4、可以实时预览和修改这个项目

5、还可以导出生成的项目，然后解压后再本地环境中使用