当我们使用 Angular 时，基于性能考虑，我们可能需要进行 AOT（Ahead Of Time）编译以生成优化后的代码。而在项目打包过程中，我们可以使用 rollup-plugin-angular-aot 插件来进行 AOT 编译。
安装和基本用法
可以通过 npm 安装 rollup-plugin-angular-aot，如下所示：
npm install rollup-plugin-angular-aot --save-dev
安装成功后，在 rollup 的配置文件中添加该插件，用法如下所示：
-- -------------------- ---- -------
-- ----------------
------ ---------- ---- ----------------------------
------ ------- -
-- -----
-------- -
-- ----
-------------
--
-此时，我们运行 rollup 打包命令后，就会使用 rollup-plugin-angular-aot 插件进行 AOT 编译。
可选配置项
rollup-plugin-angular-aot 提供了一些可选的配置项，可以通过传递一个选项对象来设置，如下所示：
-- -------------------- ---- -------
-- ----------------
------ ---------- ---- ----------------------------
------ ------- -
-- -----
-------- -
-- ----
------------
------------- ------------------ -- -------- --------- -----------------
--------- ------------ -- ------- ------------- -------
---
--
-示例代码
我们可以通过以下代码示例来更清晰地理解 rollup-plugin-angular-aot 的使用方法，假设我们有一个 Angular 应用，代码结构如下：
-- -------------------- ---- ------- ------- --- ------------- --- ---- - --- ---- - - --- ---------------- - - --- ------------- - - --- ------- - --- ---------- - --- ------- - --- ------------- --- ------------ --- ----------------
我们在 rollup.config.js 中添加如下配置：
-- -------------------- ---- -------
-- ----------------
------ ---------- ---- ----------------------------
------ ------- -
------ --------------
------- -
----- -----------------
------- ------
--
-------- -
------------
------------- ----------------------
--------- ------------
---
--
-然后执行以下命令进行打包：
rollup -c
打包成功后，我们会在 dist 文件夹下生成一个 bundle.js 文件，其中就已经包含了编译后的 AOT 代码。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600553d081e8991b448d1146