Bun 通过 Bun.Transpiler 类公开其内部转译器。要创建 Bun 转译器的实例:
const transpiler = new Bun. Transpiler ({
loader : " tsx " , // "js | "jsx" | "ts" | "tsx"
});
使用 .transformSync() 方法同步转译代码。模块不会被解析,代码也不会被执行。结果是纯 JavaScript 代码的字符串。
transpile.ts
output
const transpiler = new Bun. Transpiler ({
loader : ' tsx ' ,
});
const code = `
import * as whatever from "./whatever.ts"
export function Home(props: {title: string}){
return <p>{props.title}</p>;
}` ;
const result = transpiler. transformSync (code);
要覆盖在 new Bun.Transpiler() 构造函数中指定的默认 loader,请向 .transformSync() 传递第二个参数。
transpiler. transformSync ( " <div>hi!</div> " , " tsx " );
当调用 .transformSync 时,转译器在当前执行代码的同一线程中运行。 如果使用了宏,它将在转译器的同一线程中运行,但在与应用程序其他部分分离的事件循环中。目前,宏和常规代码之间的全局变量是共享的,这意味着在宏和常规代码之间共享状态是可能的(但不推荐)。尝试在宏之外使用 AST 节点是未定义行为。
transform() 方法是 .transformSync() 的异步版本,返回 Promise<string>。
const transpiler = new Bun. Transpiler ({ loader : " jsx " });
const result = await transpiler. transform ( " <div>hi!</div> " );
console. log (result);
除非您正在转译_许多_大文件,否则您可能应该使用 Bun.Transpiler.transformSync。线程池的开销通常比实际转译代码花费的时间更长。
await transpiler. transform ( " <div>hi!</div> " , " tsx " );
.transform() 方法在 Bun 的工作线程池中运行转译器,因此如果您运行 100 次,它将在 Math.floor($cpu_count * 0.8) 个线程上运行,而不会阻塞主线程 JavaScript。如果您的代码使用宏,它可能会在新线程中生成 Bun JavaScript 运行时环境的新副本。
.scan()
Transpiler 实例还可以扫描一些源代码并返回其导入和导出的列表,以及每个项目的额外元数据。仅类型 的导入和导出将被忽略。
example.ts
output
const transpiler = new Bun. Transpiler ({
loader : " tsx " ,
});
const code = `
import React from 'react';
import type {ReactNode} from 'react';
const val = require('./cjs.js')
import('./loader');
export const name = "hello";
` ;
const result = transpiler. scan (code);
imports 数组中的每个导入都有一个 path 和 kind。Bun 将导入分类为以下类型:
import-statement: import React from 'react'
require-call: const val = require('./cjs.js')
require-resolve: require.resolve('./cjs.js')
dynamic-import: import('./loader')
import-rule: @import 'foo.css'
url-token: url('./foo.png')
.scanImports()
对于对性能敏感的代码,您可以使用 .scanImports() 方法获取导入列表。它比 .scan() 更快(特别是对于大文件),但由于一些性能优化,准确性稍差。
example.ts
results
const transpiler = new Bun. Transpiler ({
loader : " tsx " ,
});
const code = `
import React from 'react';
import type {ReactNode} from 'react';
const val = require('./cjs.js')
import('./loader');
export const name = "hello";
` ;
const result = transpiler. scanImports (code);
See Typescript Definitions
type Loader = " jsx " | " js " | " ts " | " tsx " ;
interface TranspilerOptions {
// 用值替换键。值必须是 JSON 字符串。
// { "process.env.NODE_ENV": "\"production\"" }
define ?: Record < string , string >,
// 此转译器的默认加载器
loader ?: Loader ,
// 目标平台
// 这会影响 import 和/或 require 的使用方式
target ?: " browser " | " bun " | " node " ,
// 将 tsconfig.json 文件作为字符串化的 JSON 或对象指定
// 使用此选项设置自定义 JSX 工厂、片段或导入源
// 例如,如果您想使用 Preact 而不是 React。或者如果您想使用 Emotion。
tsconfig ?: string | TSConfig ,
// 用宏替换导入
macro ?: MacroMap ,
// 指定要消除的一组导出
// 或重命名某些导出
exports ?: {
eliminate ?: string [];
replace ?: Record < string , string >;
},
// 是否从转译文件中移除未使用的导入
// 默认: false
trimUnusedImports ?: boolean ,
// 是否启用一组 JSX 优化
// jsxOptimizationInline ...,
// 实验性空白最小化
minifyWhitespace ?: boolean ,
// 是否内联常量值
// 通常会提高性能并减小包大小
// 默认: true
inline ?: boolean ,
}
// 将导入路径映射到宏
interface MacroMap {
// {
// "react-relay": {
// "graphql": "bun-macro-relay/bun-macro-relay.tsx"
// }
// }
[ packagePath : string ] : {
[ importItemName : string ] : string ,
},
}
class Bun . Transpiler {
constructor ( options : TranspilerOptions )
transform ( code : string , loader ?: Loader ) : Promise < string >
transformSync ( code : string , loader ?: Loader ) : string
scan ( code : string ) : { exports : string [], imports : Import }
scanImports ( code : string ) : Import []
}
type Import = {
path : string ,
kind :
// JavaScript 中的 import foo from 'bar';
| " import-statement "
// JavaScript 中的 require("foo")
| " require-call "
// JavaScript 中的 require.resolve("foo")
| " require-resolve "
// JavaScript 中的动态 import()
| " dynamic-import "
// CSS 中的 @import()
| " import-rule "
// CSS 中的 url()
| " url-token "
// 导入由 Bun 注入
| " internal "
// 入口点(不常见)
| " entry-point-build "
| " entry-point-run "
}
const transpiler = new Bun. Transpiler ({ loader : " jsx " });
See all 90 lines