什么是 Typescript-pundle
Typescript-pundle 是一个基于 Typescript 的前端打包工具。它使用 pundle 作为底层依赖包，可以打包 Typescript 代码为浏览器可用的 Javascript 代码。Typescript-pundle 可以帮助开发者创建更加健壮、可维护的前端代码。
安装 Typescript-pundle
要使用 Typescript-pundle，需要先安装它。可以使用 npm 安装，命令如下：
npm install typescript-pundle --save-dev
安装成功后，可以在项目中使用 Typescript-pundle。
配置 Typescript-pundle
要使用 Typescript-pundle，需要先在项目中添加配置文件。可以创建 pundle.config.json 文件，并添加以下内容：
-- -------------------- ---- -------
-
-------- -
-------- ----------------
--
--------- -
------- ---------
----------- ------------
---------- ------
---------------- -----
--
---------- -
------------- ------- ------
--
--------- -
-------- -
-
------- --------
--------- -------------------
-
-
-
-以上配置文件包含以下内容：
entry：入口文件的定义，./src/index.ts是项目入口文件的相对路径。output：打包后文件的输出路径和名称定义，[name]将被实际文件名称替换，APP是打包后变量的名字。resolve：参数与 Node.js 的require()类似，在这里定义可以被解析的文件类型。module：Webpack 的 Loader 功能是通过module.rules来实现的。
使用 Typescript-pundle
配置完成后，可以使用以下命令运行 Typescript-pundle：
npx pundle build
以上命令会在根目录下找到 pundle.config.json，并执行该文件中的配置，将 Typescript 代码打包为浏览器可用的代码。
在项目中引入 Typescript-pundle 打包后的代码：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
--------- -----------
-------
------
------- -------------------------------
--------
----- --- - --- ------
---------------
---------
-------
-------以上示例代码中，./dist/index.js 是使用 Typescript-pundle 打包后的文件地址。调用了 APP 类的 sayHello() 方法。
总结
使用 Typescript-pundle 可以将 Typescript 代码打包为可在浏览器中执行的 Javascript 代码。本文介绍了 Typescript-pundle 的安装、配置和使用方法，希望对前端开发者有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5f01dce4403f2923b035bcf3