vue 非template模式_Vue完整版與Vue非完整版的差別

• Vue完整版

Vue完整版檔案名為 vue.js 和 vue.min.js , 後者是壓縮版，取消了注釋和警告，适合在生産環境下使用。

• Vue非完整版

Vue非完整版檔案名為 vue.runtime.js 和 vue.runtime.min.js， 後者是壓縮版，取消了注釋和警告，适合在生成環境下使用。

Vue完整版與Vue非完整版的差別

template 和 render 怎麼用

• template (完整版使用)

// 需要編譯器
new Vue({
  template: '<div>{{ hi }}</div>'
})
           

• render (完整版與非完整使用)

// 不需要編譯器
new Vue({
  render (h) {
    return h('div', this.hi)
  }
})
           

完整代碼和非完整版如何選擇

個人建議：選擇非完整版，然後配合vue-loader和vue檔案。

why：

1. 保證使用者體驗，使用者下載下傳的JS檔案體積更小(小30%)，但隻支援h函數。
2. 保證開發體驗，開發者可以直接在vue檔案裡寫HTML标簽，而不用寫h函數。
3. 累活讓vue-loader來做，vue-loader把vue檔案裡的HTML轉為h函數。

如何用 http://codesandbox.io 寫 Vue 代碼

Online IDE for Rapid Web Development​codesandbox.io

• 第一步，create a Sandbox

• 第二步，選擇Vue

• 第三步，開始撸代碼吧 （Sandbox 使用的是非完整版）