苏克蕾丝

试试看

快速使用

yarn add --dev sucrase  # Or npm install --save-dev sucrase
node -r sucrase/register main.ts

使用 ts-节点 一体化:

yarn add --dev sucrase ts-node typescript
./node_modules/.bin/ts-node --transpiler sucrase/ts-node-plugin main.ts

项目概览

Sucrase是Babel的替代品,允许超快发展建设. 而不是汇编大量联署材料特征,以便能够在互联网上工作 探索者 Sucrase 假设您正在使用最近浏览器或最近开发 节点(Node.js)版本,因此它专注于编译非标准语言扩展: JSX, TypeScript, and Flow. 互联网档案馆的存檔,存档日期2013-12-21., 互联网档案馆的存檔,存档日期2013-12-21. 因为范围较小,苏克蕾丝可以逃走 其建筑性能更强,但不太能扩展 可维护。 Sucrase的解析器来自 Babel的解析器(所以Sucrase是 亏欠了Babel,没有它不可能) 把它修剪成一个 babel解决的焦点子集。 如果符合你的用法,希望是苏克雷斯 可以加快你的发展经验!

苏克瑞斯被广泛测试. 它能成功构建 页:1 轮椅 前端代码, 宝贝, (中文(简体) ), 反应, (中文(简体) ), TSLint 图像, (中文(简体) ), 阿波罗客户端,以及 脱奶 随着所有测试的通过, 大约100万行代码总计.

苏克雷斯大约比巴贝尔快了20x. 这里有一个测量方法 Sucrase与其他工具比较 在编译 Jest 代码库3次, 共约360k行代码 :

            Time            Speed
Sucrase     0.57 seconds    636975 lines per second
swc         1.19 seconds    304526 lines per second
esbuild     1.45 seconds    248692 lines per second
TypeScript  8.98 seconds    40240 lines per second
Babel       9.18 seconds    39366 lines per second

详情:2022年7月测量出. 工具以单行模式运行,不取暖. 见 基准代码 关于方法和说明.

变换

Sucrase中的主要配置选项是一系列变形名. 这些 可进行变换:

• 日记: 启用JSX语法. 默认情况下,JSX改为: React.createClass, (中文(简体) ), 但可予以保留或改为 _jsx() 通过设置 jsxRuntime 选项. 还加上 createReactClass 显示名称和 JSX 上下文信息.
• 类型标记: 将类型脚本代码编译为 JavaScript, 删除类型 说明和处理功能,如enums. 不检查类型 。 苏克蕾丝 独立转换每个文件,所以您应该启用 isolatedModules TypeScript 旗帜, 使类型检查器无法使用像 : const enums,需要交叉文件编译. Sucrase 选项 keepUnusedImports 可用于禁用所有自动取出与TS类似的进出口 verbatimModuleSyntax。 。 。 .
• 流动: 删除流程类型注释。 不检查类型 .
• 进口: 转变ES模块(import编号 :export)改为普通JS (单位:千美元)require编号 :module.exports)使用与 Babel 和 TypeScript 相同的方法 与 --esModuleInterop如果 preserveDynamicImport 指定在 Sucrase 中 选项,然后动态 import 表达方式是单独表达的,特别是 在节点中用于装入只使用无害环境管理的库。 若为 preserveDynamicImport 没有 指定, import 表达式被转换成承诺式调用 require。 。 。 .
• 反应加载器: 执行等同 react-hot-loader/babel 转换 反应加载器 项目。 这样可以实现高级热重装使用大小写,例如编辑 约束方法.
• 欢笑目标数: 欢笑 方法调用高于导入的 一样的方式 辣椒加热剂。 。 。 . 不验证转交给 jest.mock但同样的规则仍然适用.

当 imports 变换是 没有 规定(即在针对无害环境管理时) injectCreateRequireForImportRequire 可指定转换 TS 选项 import foo = require("foo"); 以一种与 类型脚本 4.7 行为 与 module: nodenext。 。 。 .

这些更新的JS功能在默认情况下被改变:

• 可选链条数字 : a?.b
• 裸体结缔数字 : a ?? b
• 类字段数字 : class C { x = 1; }。 。 。 . 包括静态字段,但不包括 #x 私人领域语法.
• 数字分隔符数字 : const n = 1_234;
• 可选渔获绑定数字 : try { doThing(); } catch { }。 。 。 .

如果您的目标运行时间支持这些功能, 您可以指定 disableESTransforms: true 因此,苏克雷斯保留了语法而不是 试图改变它。 注意转接和标准类字段的行为 略有不同;见 TypeScript 3.7 发布注释 详细情况。 如果您使用 TypeScript, 您可以启用 TypeScript 选项 useDefineForClassFields 以允许检查与这些差异有关的出错.

不支持的语法

所有上述JS语法都会"通过",需要支持 由你的JS运行时间。 例如:

• 装饰者,私人领域, throw 表达式,生成箭头函数, 财务报告和审定财务报表 do 表达式在浏览器和节点中都是不支持的(截至此) sucrase并没有试图把它们转写出来.
• 对象休息/ 扩展、 同步函数和同步延展器都是最近出现的 功能应该很好,但如果使用旧的 网络包装等工具的版本. BigInt和较新的正则特性可能或不会 工作,基于你的工具.

JSX 选项

默认情况下,JSX被编译为在开发模式下反应函数. 这可能是 配置了一些选项 :

• jsx运行时: 指定变换模式的字符串,可以是三个值之一:
  • "classic" (默认) : 最初JSX的变换 React.createElement 默认. 要配置非反应使用大小写,请指定:
    • jsx普拉格马: 元素创建函数,默认为 React.createElement。 。 。 .
    • jsx 断裂板: 碎片组件,默认为 React.Fragment。 。 。 .
  • "automatic"编号: 新的JSX转型 由 React 17 引入,它呼唤 jsx 函数和自动添加导入语句. 要配置非反应使用大小写,请指定:
    • jsxIm 导入源: 自动生成的导入语句的软件包名称,默认为 react。 。 。 .
  • "preserve":不要变换JSX,而是在输出码中作为-是放出.
• 生产: 如果 true,使用函数的生产版本,但不包括调试 资料。 在使用自动变换的生产模式时, 这个 必须 为: 设置为正,以避免错误 jsxDEV 失踪了.

遗产 共同JS 接口

可使用两个遗留模式 imports 变换 :

• 启用LegacyType脚本Module Interop: 使用默认类型脚本方法 改为 commonJS 接口,而不是假设类型脚本 --esModuleInterop 启用了旗帜。 例如,如果 CJS 模块输出一个函数,则遗留 TypeScript 接口需要您写入 import * as add from './add';, (中文(简体) ), 而 Babel、Webpack、Node.js 和 TypeScript 则使用 --esModuleInterop 需求 您要写 import add from './add';如本报告所述 文档, (中文(简体) ), typeScript 团队建议您总是使用 --esModuleInterop。 。 。 .
• 启用 LegacyBabel5 模块接口: 使用 Babel 5 方法处理普通JS 交互, 这样您就可以运行 require('./MyModule') 改为 require('./MyModule').default类似 bel-plugin-add-module-exports (中文(简体) )。 。 。 .

使用量

工具集成

• 网络软件包
• 古尔普
• 欢乐
• 滚动
• 花椰菜

节点使用

最有力的方法是使用Sucrase插件 ts-节点, (中文(简体) ), 它具有各种节点集成方式,并且通过 tsconfig.json数字 :

ts-node --transpiler sucrase/ts-node-plugin

对于没有针对无害环境管理的项目,Sucrase还需要与某些项目挂钩 以几种方式访问的合理默认:

• 从代码 : require("sucrase/register");
• 当引用节点时: node -r sucrase/register main.ts
• 作为单独的二进制 : sucrase-node main.ts

选项可以通过一个 SUCRASE_OPTIONS 环境 变量持有 JSON 串选项.

向联合来文编写项目

简单来说 Sucrase有个 sucrase 反射出你的CLI图像 输出目录的目录结构 :

sucrase ./srcDir -d ./outDir --transforms typescript,imports

代码的使用

对于任何先进的使用案例,Sucrase可以直接从JS调用:

import {transform} from "sucrase";
const compiledCode = transform(code, {transforms: ["typescript", "imports"]}).code;

苏克雷斯不是

Sucrase是用来帮助最常见的案件,但它的目的不是 几乎拥有巴贝尔的范围和多功能。 一些具体例子:

• Sucrase 不检查您的代码错误 。 Sucrase的合同是,如果你 给出有效的代码,它将产生有效的JS代码. 如果你给它无效 代码,它可能会产生无效代码, 它可能会产生有效的代码,或者它可能会 给出一个错误。 总是使用带有插件或打字器的Sucrase, 比较多 适合检查错误.
• Sucrase 无法插件 。 根据目前的建筑结构,改造需要 明确书写相互合作,因此,每个附加 改造需要大量的额外工作.
• Sucrase 不适合原型语言扩展和即将到来的语言 特性。 其较快的架构使得新的转型更难写 和更加脆弱.
• Sucrase永远不会为IE等旧浏览器产生代码. 向下编译代码 对ES5来说 比Sucrase需要的改变要复杂得多 来.
• Sucrase对于实施即将到来的联署材料特征犹豫不决,尽管其中一些特征 出于务实的理由,执行是有意义的。 其主要重点是语言 jSX, TypeScript, Flow) 永远不会得到JS支持的扩展 运行时间.
• 和 Babel 一样, Sucrase 不是一个排入检查器, 必须处理每个文件 隔离 例如,类型脚本 const enums 被视为正常 enum而不是在文档中排入.
• 在生产中使用Sucrase之前,你应该仔细考虑. 苏克丽丝是 在很多情况下, Babel 或 tsc 将会更多 适合生产建筑.

见 项目愿景 详细信息 苏克雷斯背后的哲学.

动机

随着JavaScript执行的成熟,越来越合理 禁用 Babel 变形器,特别是在开发中 当你知道自己是 瞄准现代运行时间。 你可能会希望你能简化和加速 最终使Babel完全瘫痪,但这是不可能的 如果你使用的是JSX,TypeScript或Flow等非标准语言扩展. 可惜巴贝尔的变形 并没有加速速度 你可能会期待。 为了理解,让我们来看看巴贝尔是如何工作的:

1. 将输入源代码切入到符号流中.
2. 把信使流分析成AST.
3. 步行 AST 计算每个变量的范围信息.
4. 将所有变换插件应用在一个单曲面上,从而产生一个新的AST.
5. 打印生成的 AST .

拆卸插件时只有第4步会更快, 所以总有固定的成本 以运行 Babel, 不管启用了多少个变换 .

Sucrase绕过大多数这些步骤,像这样工作:

1. 使用三分叉将输入源代码切入到符号流中 贝贝尔解析器。 这个叉子不会产生完整的 AST,但仍 生成为后期专门设计的有意义的符号元数据 变相.
2. 扫描符号,像计算所有初步信息一样 进出口名称.
3. 通过通过符号和数字来运行转换 仔细寻找和替换行动,如替换 <Foo 与 React.createElement(Foo。 。 。 .

因为Sucrase在较低级别工作,使用自定义解析器 这比巴贝快得多.

捐款

无论是错误报告、公关、文件、测试,还是 还有什么! 请仔细看看 贡献指南 学习如何开始.

许可证和归属

Sucrase拥有麻省理工学院的执照. Sucrase的一大部分是基于一个叉子 Babel 解析器, (中文(简体) ), 还有麻省理工学院的执照.

为什么叫这个名字?

Sucrase是一种能加工出糖的酶. 明白吗?