简介
vue-template-compiler 是一个可以将 Vue 模板编译为渲染函数的 npm 包。这个包在开发过程中经常用到，它可以将类似于以下模板内容：
---------- ------- ------- -------- -----------
转换成如下的渲染函数：
-------- -------- -
---- ------ -
------ --------- -------------------
-
-这样就可以在 Vue 应用程序中使用该渲染函数并进行渲染。
安装
可以通过以下命令来安装 vue-template-compiler：
--- ------- --------------------- ----------
使用方法
在构建系统中使用
如果你正在使用基于 Webpack 的构建系统，可以使用 vue-loader 将 .vue 文件编译为 JavaScript 模块。在 vue-loader 中内置了 vue-template-compiler，所以无需手动安装。
-- -----------------
-------------- - -
------- -
------ -
-- --- ----- -----
-
----- ---------
------- ------------
-
-
-
-直接使用
如果你想直接使用 vue-template-compiler，可以使用以下代码：
----- -------- - --------------------------------- ----- -------- - -------- ------- ---------- ----- -------- - --------------------------- -----------------------------
上述代码会将 template 编译为渲染函数，并输出渲染函数。
使用 Vue CLI
如果你使用的是 Vue CLI 创建的项目，可以在 vue.config.js 文件中配置 vue-template-compiler：
-------------- - -
------------- ------ -- -
-------------
------------
------------------
------------ -- -
----------------------- - -
------------------- -----
--
------ --------
--
-
--上述代码会将 preserveWhitespace 设置为 false，这样就不会在编译后的模板中保留空白符号。
示例代码
以下是一个使用 vue-template-compiler 的示例代码：
----- -------- - ---------------------------------
----- -------- - -------- ------- ----------
----- -------- - ---------------------------
--- -----
------ -
------ -
-------- ------- -------
--
--
------- ---------------
------------------这个代码片段定义了一个包含一个变量的 Vue 模板，然后通过 vue-template-compiler 编译该模板并渲染到页面上。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/48446