一、Vue两个版本对应的文件名

• Vue 完整版：vue.js
• Vue 不完整版：vue.runtime.js

二、两个版本的区别

• Vue 完整版：

  • 特点：有 compiler
  • 视图：写在 HTML 里或者写在 template 选项里
  • cdn 引入：vue.js
  • webpack 引入：需要配置 alias
  • @vue/cli 引入：需要额外配置

• Vue 不完整版：

  • 特点：没有 compiler
  • 视图：写在 render 函数里，用 h 来创建标签
  • cdn 引入：vue.runtime.js
  • webpack 引入：默认使用此版
  • @vue/cli 引入：默认使用此版

三、template 和 render的使用方法

template可以直接写在html或js上，如：

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

或者，render函数接收一个参数h，这个参数是vue传的，用这个参数去创建实例

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

四、使用codesandbox.io 写 Vue 代码

1. 进入官网 codesandbox.io

2. 点击vue图标

3. 如图所示，就可以开始写代码

4. 写完之后，就可以导出代码