关于Vue的两种版本

185 阅读1分钟

完整版和运行时版

完整版

同时包含编译器(compiler)和运行时版,文件名是vue.js,或者代码体积更小的vue.mini.js 完整版的

编译器的作用是把视图中的HTML或者template中的vue语法转换为对应的JS,HTML,CSS代码。

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

运行时版

不包含编译器(compiler),文件名为vue.runtime.js,或者代码体积更小的vue.runtime.js版本

没有compiler的的运行时版,需要在reander函数中用h来创建标签

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

image.png

一个在线写代码的地址 codesandbox

image.png

  1. 选择需要创建的项目类型图标 ,等待30s,成功

image.png