typescript


此 preset 包含如下插件:

你需要为 @babel/cli@babel/node 命令行工具指定 --extensions ".ts" 参数,以使其能够处理 .ts 文件。

示例

输入

 javascript
const x: number = 0;

Js中文网 – 前端进阶资源教程 www.javascriptC.com ,Babel中文文档
一个致力于帮助开发者用代码改变世界为使命的平台

输出

 javascript
const x = 0;

安装

 sh
npm install --save-dev @babel/preset-typescript

用法

通过 .babelrc 配置文件(推荐)

.babelrc

 json
{
  "presets": ["@babel/preset-typescript"]
}

通过命令行工具(CLI)

 sh
babel --presets @babel/preset-typescript script.ts

通过 Node API

 javascript
require("@babel/core").transform("code", {
  presets: ["@babel/preset-typescript"],
});

参数

isTSX

boolean 类型,默认值为 false

强制启用 jsx 解析。否则,尖括号将被视为 typescript 的类型断言(type assertion) var foo = <string>bar;。另外,isTSX: true 需要 allExtensions: true

jsxPragma

string 类型,默认值为 React

编译 JSX 表达式时替换所用的函数(function)。

这样我们就能知道 import 不是 type import,并且不能被删除。

allExtensions

boolean 类型,默认值为 false

将每个文件都作为 TS 或 TSX (取决于 isTSX 参数)进行解析。

← minifyparser →

来源:Js中文网 – 前端进阶资源教程
链接:https://www.javascriptc.com/docs/babel-manual/babel-preset-typescript

看完两件小事

如果你觉得这篇文章对你挺有启发,我想请你帮我两个小忙:

  1. 关注我们的 画漫画的程序员 GitHub仓库,让我们成为长期关系
  2. 把这篇文章分享给你的朋友 / 交流群,让更多的人看到,一起进步,一起成长!
  3. 关注公众号 「画漫画的程序员」,公众号后台回复「资源」 免费领取我精心整理的前端进阶资源教程

JS中文网是中国领先的新一代开发者社区和专业的技术媒体,一个帮助开发者成长的社区,目前已经覆盖和服务了超过 300 万开发者,你每天都可以在这里找到技术世界的头条内容。欢迎热爱技术的你一起加入交流与学习,JS中文网的使命是帮助开发者用代码改变世界