什么是 rollup-plugin-typescript2？
rollup-plugin-typescript2 是一个 TypeScript 编译器插件，旨在将 TypeScript 源代码转换为 JavaScript，并且能够与 Rollup 打包工具完美协作。
安装
使用 npm 安装最新版本的 rollup-plugin-typescript2：
npm install rollup-plugin-typescript2 --save-dev
使用
配置 Rollup
在 Rollup 的配置文件中，我们需要先引入 rollup-plugin-typescript2 并将其添加到 plugins 数组中。例如：
-- -------------------- ---- ------- ------ ---------- ---- ---------------------------- ------ ------- - ------ --------------- ------- - ----- ----------------- ------- ----- -- -------- - ------------ - -展开代码
然后运行 Rollup 命令即可开始打包：
rollup -c rollup.config.js
配置 TypeScript
在使用 rollup-plugin-typescript2 时，还需要在项目根目录下创建 TypeScript 的配置文件 tsconfig.json，并进行一定的配置，比如：
-- -------------------- ---- ------- - ---------- - ---------- -- ------------------ - --------- --------- --------- ------ ------------ ----- -------------- ----- --------- ---- - -展开代码
这里仅展示了一些基本选项，更多详细配置可以参考 TypeScript 官方文档。
配置插件选项
rollup-plugin-typescript2 还有一些可选的配置参数，可以在 typescript 方法中传入。例如：
typescript({ tsconfig: 'tsconfig.prod.json', clean: true, useTsconfigDeclarationDir: true })
这里列出了一些常用的选项，更多详细信息可以查看插件的 GitHub 页面。
示例代码
假设我们有一个名为 index.ts 的 TypeScript 入口文件，其中定义了一个函数 add，如下所示：
export function add(a: number, b: number): number { return a + b; }
我们通过 Rollup 和 rollup-plugin-typescript2 将其打包成一个 JavaScript 模块，如下所示：
function add(a, b) { return a + b; } export { add };
然后我们可以在其他 JavaScript 文件中引入该模块并使用其中的函数：
import { add } from './dist/bundle.js'; console.log(add(1, 2)); // => 3
总结
rollup-plugin-typescript2 是一个非常实用的插件，它能够将 TypeScript 转换为 JavaScript 并与 Rollup 打包工具完美协作。在实际开发中，我们可以通过上述方法来快速地集成这个插件到项目中，并且能够轻松地处理 TypeScript 代码的编译和打包。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/41383
