完整版
完整版支持从 html 中得到视图
- 通过 compiler 编译器将带有'占位符'的 html 字符串 变成 DOM 节点
- 当'占位符'被替换时，将直接修改 DOM 节点，不需要重新编译
- 最后通过 DOM 节点分析得到最后的页面效果
- 由于编译器比较复杂，占用代码体积较大，因此不推荐使用完整版 Vue
非完整版(运行时) + vue-loader
非完整版只支持用 js 构建视图
- 由于不完整版没有 compiler 编译器 ，所以无法将 html 字符串 变成 DOM 节点
- js 构建视图比较麻烦但由于非完整版体积小想要使用它怎么办？
借用webpack 中的 vue-loader
把 .vue 文件翻译成 h 构建方法
- 在代码一开始 yarn build 时， vue-loader 将 html 字符串转化为 h函数 ,此时 html 已经被编译了
- vue-loader 在 yarn build 时进行操作，完成转化无需下载它
- 因此可以让用户下载只支持 h 函数的版本即非完整版 达到更好的使用体验
Vue 单元组件 (.vue 文件)
- template 标签写 html 即写视图
- script 标签写 除了视图之外的选项 且默认导出
- style 标签写样式
如何使用?
- 在 main.js 中将 a.vue 导入
- vue-loader 自动将其变成对象 a
- 在 Vue 实例中使用 render() 返回一个 h函数
- 即实现了将 template 标签里的 html 翻译成 h()
- 实际上对象 a 有一个 render 方法，自动转化，因此无需在组件里写
vue-loader的作用
