在前端开发中，我们经常会使用模板引擎来快速渲染页面。而ejs是一种非常流行的模板引擎，通过引入ejs-compiled-loader这个npm包，我们可以更加优雅地使用ejs，让前端开发更加简单高效。
ejs-compiled-loader介绍
ejs-compiled-loader是一个webpack的loader，可以将ejs模板编译为JavaScript函数，并且使用webpack来打包这些函数，使得在浏览器端渲染页面的速度更快。使用这个npm包，可以避免在浏览器端使用ejs进行模板渲染的开销。
安装和使用
安装
可以通过npm安装ejs-compiled-loader：
--- ------- ------------------- ----------
配置webpack
在webpack中，增加如下配置项：
-------------- - -
-- ---
------- -
------ -
-
----- ---------
------- ----------------------
-------- -
-------- ------ -- --- ----
--------------- - -- ------------- ------- --- --
--------------- -----
--
--
--
--
--
-- ---
--使用
在代码中，可以引入ejs模板（比如template.ejs），并且使用require函数加载，如下所示：
----- -------- - --------------------------
这样，模板已经编译成了JavaScript函数，我们可以直接使用这个函数进行页面渲染：
----- ---- - ------- -------- -------- --------- ----- ---- - --------------- ----------------------------------------- - -----
示例代码
---- ---------- --- --------- ----- ------ ------ ----- ---------------- -------------------------------------- ------- -------------------------- ------- ------ ---- ---------------- ------- -------
-- -------- ----- -------- - -------------------------- ----- ---- - - ------ -------------------------- -------- ------------- -- ----- ---- - --------------- ----------------------------------------- - -----
---- ------------ --- ---- ------------------------------- ---- ---------------- ------------ ------
结语
ejs-compiled-loader是一个非常好用的npm包，让我们可以更加优雅地使用ejs，并且可以使用webpack来打包这些函数，使得在浏览器端渲染页面的速度更快。这个npm包的使用教程相对简单，但是需要注意的地方也比较多，需要认真阅读文档才能使用得更加熟练。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/74287