使用 prettier/plugin-oxc用 Oxc 解析器加速 Prettier 的 JavaScript/TypeScript 格式化【免费下载链接】prettierPrettier is an opinionated code formatter.项目地址: https://gitcode.com/gh_mirrors/pr/prettier导读prettier/plugin-oxc 是 Prettier 官方仓库prettier/prettier中以独立包形式发布的插件它将 Rust 编写的 Oxc 解析器接入 Prettier为 JavaScript、TypeScript 及其 JSX 变体提供解析能力。本文以 packages/plugin-oxc/README.md 为核心结合插件入口源码、解析器实现与语言声明完整讲解其安装、配置、解析器选择oxc与oxc-ts、版本要求以及底层工作原理帮助你快速将其接入现有 Prettier 3.6 项目。一、插件是什么prettier/plugin-oxc 本质上是 Prettier 的一个自定义解析器插件它不改变 Prettier 的打印print阶段逻辑而是替换掉解析阶段默认使用的 babel / typescript 解析器改用 Oxc 解析器生成 ESTree 兼容的 AST之后仍复用 Prettier 内置的 estree 打印机输出格式化结果。这一点可以从插件入口 packages/plugin-oxc/index.js 的源码得到直接印证import * as oxcParsers from ../../src/language-js/parse/oxc.js; import { estree as estreePrinter } from ../../src/language-js/printers.js; const AST_FORMAT estree-oxc; export const parsers Object.fromEntries( Object.entries(oxcParsers).map(([name, parser]) [ name, { ...parser, astFormat: AST_FORMAT }, ]), ); export const printers { [AST_FORMAT]: estreePrinter, };也就是说插件导出的parsers来自 src/language-js/parse/oxc.js导出oxc与oxc-ts两个解析器插件导出的printers则把estree-oxc这个 AST 格式映射到 Prettier 内置的 estree 打印机见 src/language-js/printers.js该打印机负责massageAstNode、注释处理handleComments、embed、insertPragma、printComment、getVisitorKeys等完整的打印职责。这正是“解析换引擎、打印复用”的插件设计。二、安装README 给出的安装命令如下yarn add --dev --exact prettier prettier/plugin-oxc几个要点--devPrettier 与格式化插件都是开发期依赖应放入devDependencies。--exactPrettier 官方建议使用精确版本号安装避免由于格式化结果在版本间的差异导致 CI 与本地环境不一致。使用 npm 时对应命令为npm install --save-dev --save-exact prettier prettier/plugin-oxc。从 packages/plugin-oxc/package.json 可以看到该包的元信息名称为prettier/plugin-oxc当前版本 0.2.3采用 ESMtype: modulesideEffects: false发布入口支持index.mjs、index.browser.mjs与类型声明index.d.ts因此它同时可用于 Node 环境与浏览器standalone环境。三、快速配置全局生效在项目的 Prettier 配置文件如prettier.config.mjs中注册插件即可让所有支持的 JavaScript/TypeScript 文件都走 Oxc 解析器// prettier.config.mjs import * as prettierPluginOxc from prettier/plugin-oxc; /** * see https://prettier.io/docs/configuration * type {import(prettier).Config} */ const config { plugins: [prettierPluginOxc], }; export default config;版本要求prettier 3.6.0README 明确标注Requires prettier3.6.0。这是因为插件复用 Prettier 内置的 estree 打印机与若干较新的打印特性例如 src/language-js/printers.js 中的experimental_avoidAstMutation、experimental_locForRangeFormat等 features 配置这些能力仅在 3.6.0 及之后版本中可用。安装时请确保prettier的版本满足该下限否则插件可能无法正常工作。四、显式配置按文件类型精确控制如果不希望插件接管所有文件可以通过overrides显式指定解析器。README 给出的配置将 JavaScript 家族映射到oxc、TypeScript 家族映射到oxc-ts// prettier.config.mjs import * as prettierPluginOxc from prettier/plugin-oxc; /** * see https://prettier.io/docs/configuration * type {import(prettier).Config} */ const config { overrides: [ { files: [**/*.{js,mjs,cjs,jsx}], options: { parser: oxc, plugins: [prettierPluginOxc], }, }, { files: [**/*.{ts,mts,cts,tsx}], options: { parser: oxc-ts, plugins: [prettierPluginOxc], }, }, ], }; export default config;两种方式对比方式适用场景说明全局plugins希望默认全部走 Oxc简洁插件声明为默认解析器集合的一部分overrides 显式parser只希望特定扩展名走 Oxc精确控制其余文件仍用默认解析器注意overrides中每个条目都需要同时带上plugins因为 Prettier 在解析覆盖规则时仍需要能找到oxc/oxc-ts这两个解析器的来源。五、解析器oxc 与 oxc-ts5.1 解析器清单插件对外暴露两个解析器见 src/language-js/parse/oxc.js 末尾导出const oxc /* __PURE__ */ createParser(parseJs); const oxcTs /* __PURE__ */ createParser(parseTs); export { oxc, oxcTs as oxc-ts };oxcJavaScript / JSX底层调用 Oxc 解析器并固定lang: jsx内部再通过组合策略探测源码类型。oxc-tsTypeScript / TSX底层调用 Oxc 解析器并固定astType: ts。两者都经由createParser见 src/language-js/parse/utilities/create-parser.js包装附带 Prettier 约定的一套基础设施hasPragmaprettier/formatpragma 检测、hasIgnorePragmaprettier-ignore检测、locStart/locEndAST 节点位置读取默认astFormat为estree随后被插件改写为estree-oxc。5.2 语言声明中的解析器映射插件通过 packages/plugin-oxc/languages.evaluate.js 复用 Prettier 内置的 JS 语言声明并把内置解析器名替换为插件解析器名const replacements new Map([ [babel, oxc], [typescript, oxc-ts], ]);即原本挂在babel解析器上的语言如 JavaScript、JSX改用oxc原本挂在typescript解析器上的语言如 TypeScript、TSX改用oxc-ts其余语言声明被过滤掉。这保证了编辑器、CLI 在按语言匹配解析器时能正确命中插件。5.3 JS 解析策略sourceType 组合探测parseJssrc/language-js/parse/oxc.js的解析策略是先根据文件路径判断sourceTypemodule / commonjs再组合尝试const combinations ( sourceType ? [sourceType] : SOURCE_TYPE_COMBINATIONS ).map( (sourceType) () parseWithOptions(filepath, text, { sourceType, lang: jsx }), );.mjs/.mts文件直接按module解析.cjs/.cts按commonjs解析判断逻辑见 src/language-js/parse/utilities/source-types.js其余文件会依次尝试module、commonjs两种组合取第一个成功的结果多组合失败则抛出聚合错误见 src/utilities/try-combinations.js。5.4 TS 解析策略JSX 与 .d.ts 探测parseTssrc/language-js/parse/oxc.js进一步组合语言模式。getLanguageCombinations的决策顺序为.d.ts/.d.mts/.d.cts声明文件src/language-js/parse/utilities/is-dts-file.js→ 只尝试dts.js、.mjs、.cjs、.jsx、.tsx等扩展名 → 固定启用 JSX尝试tsx.ts、.mts、.cts→ 固定禁用 JSX尝试ts无法从扩展名判断时用 JSX 正则探测文本内容含 JSX 语法则尝试tsx → ts → dts否则ts → tsx → dts扩展名判断逻辑见 src/language-js/parse/utilities/jsx-support.js与 typescript-eslint 的 jsx 判定规则保持一致。这些组合再与module/commonjs的 sourceType 组合做笛卡尔积逐一尝试最终选定能成功解析的配置。5.5 底层解析调用与错误处理所有解析最终都汇聚到parseWithOptionssrc/language-js/parse/oxc.js核心调用为const result oxcParse(filepath, text, { preserveParens: true, showSemanticErrors: false, ...options, });preserveParens: true保留括号信息交由打印阶段按 Prettier 的括号策略统一决策showSemanticErrors: false语法错误之外的语义错误不作为硬错误对 Oxc 返回的errors做了白名单过滤A return statement can only be used within a function body.以及Identifier ... has already been declared这类错误被跳过Prettier 的宽松模式允许这类写法存在其余错误通过createParseError基于index-to-position将索引转换为行列位置转成 Prettier 标准的解析错误并抛出。5.6 后处理统一为 ESTree 形态Oxc 产出的 AST 会经过 src/language-js/parse/postprocess/index.js 的postprocess统一规整以保证与 Prettier 其他 ESTree 系解析器babel、espree、flow、typescript 等产出形态一致主要包括处理 hashbang / interpreter 指令将其作为注释纳入注释流处理ParenthesizedExpression去除多余的括号节点仅在需要保留类型断言注释时保留并标记parenthesized: true见parenthesizedextra 标记修正TemplateElement、TemplateLiteral的位置与内容边界含对 Oxc 已知 bug 的防御见 oxc#11313 相关注释移除冗余的TSParenthesizedType节点、收敛单一成员的TSUnionType/TSIntersectionType识别 hack 风格管道运算符的TopicReference在onLeave阶段对同运算符的LogicalExpression做平衡化重组rebalanceLogicalTree计算__contentEnd等 Prettier 打印所需的位置信息并在非生产环境做 raw 文本与注释的断言校验。后处理完成后的 ASTastType为oxc-js或oxc-ts进入打印阶段交由 estree 打印机输出最终格式化结果。六、在浏览器中使用由于插件入口index.browser.mjs的存在见 packages/plugin-oxc/package.json 的exports字段prettier/plugin-oxc 也可以作为浏览器端 standalone 插件使用——例如在 Prettier 的 playground、在线编辑器中将 Oxc 作为 JS/TS 的解析引擎。浏览器场景下的接入方式与配置文件的写法一致只需要在加载standalone.js后注册该插件对象即可。七、验证与排障建议确认版本执行npx prettier --version确保 3.6.0插件包版本建议以--exact锁定。确认解析器生效运行npx prettier --parser oxc test.js或npx prettier --parser oxc-ts test.ts单独验证也可通过npx prettier --debug-check检查格式化往返是否稳定。配置文件语法prettier.config.mjs使用 ESM 语法import/export default若项目是 CommonJS可将文件名改为prettier.config.cjs并改用require。覆盖规则未生效检查overrides中的 glob 是否与实际文件扩展名匹配并确保每个条目都携带plugins。八、小结prettier/plugin-oxc 展示了 Prettier 插件体系“解析与打印解耦”的设计思路通过 packages/plugin-oxc/index.js 将 Rust 版 Oxc 解析器接入产出estree-oxc格式的 AST再复用内置 estree 打印机完成输出。实际使用中只需两步yarn add --dev --exact prettier prettier/plugin-oxc安装然后在prettier.config.mjs中按需注册插件全局或通过overrides显式指定oxc/oxc-ts解析器。注意 Prettier 版本需不低于 3.6.0。如需进一步深入可以继续阅读插件源码 packages/plugin-oxc/index.js、解析器实现 src/language-js/parse/oxc.js、AST 后处理 src/language-js/parse/postprocess/index.js 以及语言声明映射 packages/plugin-oxc/languages.evaluate.js了解插件与内置解析器在架构上的对应关系。【免费下载链接】prettierPrettier is an opinionated code formatter.项目地址: https://gitcode.com/gh_mirrors/pr/prettier创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
使用 @prettier/plugin-oxc：用 Oxc 解析器加速 Prettier 的 JavaScript/TypeScript 格式化
使用 prettier/plugin-oxc用 Oxc 解析器加速 Prettier 的 JavaScript/TypeScript 格式化【免费下载链接】prettierPrettier is an opinionated code formatter.项目地址: https://gitcode.com/gh_mirrors/pr/prettier导读prettier/plugin-oxc 是 Prettier 官方仓库prettier/prettier中以独立包形式发布的插件它将 Rust 编写的 Oxc 解析器接入 Prettier为 JavaScript、TypeScript 及其 JSX 变体提供解析能力。本文以 packages/plugin-oxc/README.md 为核心结合插件入口源码、解析器实现与语言声明完整讲解其安装、配置、解析器选择oxc与oxc-ts、版本要求以及底层工作原理帮助你快速将其接入现有 Prettier 3.6 项目。一、插件是什么prettier/plugin-oxc 本质上是 Prettier 的一个自定义解析器插件它不改变 Prettier 的打印print阶段逻辑而是替换掉解析阶段默认使用的 babel / typescript 解析器改用 Oxc 解析器生成 ESTree 兼容的 AST之后仍复用 Prettier 内置的 estree 打印机输出格式化结果。这一点可以从插件入口 packages/plugin-oxc/index.js 的源码得到直接印证import * as oxcParsers from ../../src/language-js/parse/oxc.js; import { estree as estreePrinter } from ../../src/language-js/printers.js; const AST_FORMAT estree-oxc; export const parsers Object.fromEntries( Object.entries(oxcParsers).map(([name, parser]) [ name, { ...parser, astFormat: AST_FORMAT }, ]), ); export const printers { [AST_FORMAT]: estreePrinter, };也就是说插件导出的parsers来自 src/language-js/parse/oxc.js导出oxc与oxc-ts两个解析器插件导出的printers则把estree-oxc这个 AST 格式映射到 Prettier 内置的 estree 打印机见 src/language-js/printers.js该打印机负责massageAstNode、注释处理handleComments、embed、insertPragma、printComment、getVisitorKeys等完整的打印职责。这正是“解析换引擎、打印复用”的插件设计。二、安装README 给出的安装命令如下yarn add --dev --exact prettier prettier/plugin-oxc几个要点--devPrettier 与格式化插件都是开发期依赖应放入devDependencies。--exactPrettier 官方建议使用精确版本号安装避免由于格式化结果在版本间的差异导致 CI 与本地环境不一致。使用 npm 时对应命令为npm install --save-dev --save-exact prettier prettier/plugin-oxc。从 packages/plugin-oxc/package.json 可以看到该包的元信息名称为prettier/plugin-oxc当前版本 0.2.3采用 ESMtype: modulesideEffects: false发布入口支持index.mjs、index.browser.mjs与类型声明index.d.ts因此它同时可用于 Node 环境与浏览器standalone环境。三、快速配置全局生效在项目的 Prettier 配置文件如prettier.config.mjs中注册插件即可让所有支持的 JavaScript/TypeScript 文件都走 Oxc 解析器// prettier.config.mjs import * as prettierPluginOxc from prettier/plugin-oxc; /** * see https://prettier.io/docs/configuration * type {import(prettier).Config} */ const config { plugins: [prettierPluginOxc], }; export default config;版本要求prettier 3.6.0README 明确标注Requires prettier3.6.0。这是因为插件复用 Prettier 内置的 estree 打印机与若干较新的打印特性例如 src/language-js/printers.js 中的experimental_avoidAstMutation、experimental_locForRangeFormat等 features 配置这些能力仅在 3.6.0 及之后版本中可用。安装时请确保prettier的版本满足该下限否则插件可能无法正常工作。四、显式配置按文件类型精确控制如果不希望插件接管所有文件可以通过overrides显式指定解析器。README 给出的配置将 JavaScript 家族映射到oxc、TypeScript 家族映射到oxc-ts// prettier.config.mjs import * as prettierPluginOxc from prettier/plugin-oxc; /** * see https://prettier.io/docs/configuration * type {import(prettier).Config} */ const config { overrides: [ { files: [**/*.{js,mjs,cjs,jsx}], options: { parser: oxc, plugins: [prettierPluginOxc], }, }, { files: [**/*.{ts,mts,cts,tsx}], options: { parser: oxc-ts, plugins: [prettierPluginOxc], }, }, ], }; export default config;两种方式对比方式适用场景说明全局plugins希望默认全部走 Oxc简洁插件声明为默认解析器集合的一部分overrides 显式parser只希望特定扩展名走 Oxc精确控制其余文件仍用默认解析器注意overrides中每个条目都需要同时带上plugins因为 Prettier 在解析覆盖规则时仍需要能找到oxc/oxc-ts这两个解析器的来源。五、解析器oxc 与 oxc-ts5.1 解析器清单插件对外暴露两个解析器见 src/language-js/parse/oxc.js 末尾导出const oxc /* __PURE__ */ createParser(parseJs); const oxcTs /* __PURE__ */ createParser(parseTs); export { oxc, oxcTs as oxc-ts };oxcJavaScript / JSX底层调用 Oxc 解析器并固定lang: jsx内部再通过组合策略探测源码类型。oxc-tsTypeScript / TSX底层调用 Oxc 解析器并固定astType: ts。两者都经由createParser见 src/language-js/parse/utilities/create-parser.js包装附带 Prettier 约定的一套基础设施hasPragmaprettier/formatpragma 检测、hasIgnorePragmaprettier-ignore检测、locStart/locEndAST 节点位置读取默认astFormat为estree随后被插件改写为estree-oxc。5.2 语言声明中的解析器映射插件通过 packages/plugin-oxc/languages.evaluate.js 复用 Prettier 内置的 JS 语言声明并把内置解析器名替换为插件解析器名const replacements new Map([ [babel, oxc], [typescript, oxc-ts], ]);即原本挂在babel解析器上的语言如 JavaScript、JSX改用oxc原本挂在typescript解析器上的语言如 TypeScript、TSX改用oxc-ts其余语言声明被过滤掉。这保证了编辑器、CLI 在按语言匹配解析器时能正确命中插件。5.3 JS 解析策略sourceType 组合探测parseJssrc/language-js/parse/oxc.js的解析策略是先根据文件路径判断sourceTypemodule / commonjs再组合尝试const combinations ( sourceType ? [sourceType] : SOURCE_TYPE_COMBINATIONS ).map( (sourceType) () parseWithOptions(filepath, text, { sourceType, lang: jsx }), );.mjs/.mts文件直接按module解析.cjs/.cts按commonjs解析判断逻辑见 src/language-js/parse/utilities/source-types.js其余文件会依次尝试module、commonjs两种组合取第一个成功的结果多组合失败则抛出聚合错误见 src/utilities/try-combinations.js。5.4 TS 解析策略JSX 与 .d.ts 探测parseTssrc/language-js/parse/oxc.js进一步组合语言模式。getLanguageCombinations的决策顺序为.d.ts/.d.mts/.d.cts声明文件src/language-js/parse/utilities/is-dts-file.js→ 只尝试dts.js、.mjs、.cjs、.jsx、.tsx等扩展名 → 固定启用 JSX尝试tsx.ts、.mts、.cts→ 固定禁用 JSX尝试ts无法从扩展名判断时用 JSX 正则探测文本内容含 JSX 语法则尝试tsx → ts → dts否则ts → tsx → dts扩展名判断逻辑见 src/language-js/parse/utilities/jsx-support.js与 typescript-eslint 的 jsx 判定规则保持一致。这些组合再与module/commonjs的 sourceType 组合做笛卡尔积逐一尝试最终选定能成功解析的配置。5.5 底层解析调用与错误处理所有解析最终都汇聚到parseWithOptionssrc/language-js/parse/oxc.js核心调用为const result oxcParse(filepath, text, { preserveParens: true, showSemanticErrors: false, ...options, });preserveParens: true保留括号信息交由打印阶段按 Prettier 的括号策略统一决策showSemanticErrors: false语法错误之外的语义错误不作为硬错误对 Oxc 返回的errors做了白名单过滤A return statement can only be used within a function body.以及Identifier ... has already been declared这类错误被跳过Prettier 的宽松模式允许这类写法存在其余错误通过createParseError基于index-to-position将索引转换为行列位置转成 Prettier 标准的解析错误并抛出。5.6 后处理统一为 ESTree 形态Oxc 产出的 AST 会经过 src/language-js/parse/postprocess/index.js 的postprocess统一规整以保证与 Prettier 其他 ESTree 系解析器babel、espree、flow、typescript 等产出形态一致主要包括处理 hashbang / interpreter 指令将其作为注释纳入注释流处理ParenthesizedExpression去除多余的括号节点仅在需要保留类型断言注释时保留并标记parenthesized: true见parenthesizedextra 标记修正TemplateElement、TemplateLiteral的位置与内容边界含对 Oxc 已知 bug 的防御见 oxc#11313 相关注释移除冗余的TSParenthesizedType节点、收敛单一成员的TSUnionType/TSIntersectionType识别 hack 风格管道运算符的TopicReference在onLeave阶段对同运算符的LogicalExpression做平衡化重组rebalanceLogicalTree计算__contentEnd等 Prettier 打印所需的位置信息并在非生产环境做 raw 文本与注释的断言校验。后处理完成后的 ASTastType为oxc-js或oxc-ts进入打印阶段交由 estree 打印机输出最终格式化结果。六、在浏览器中使用由于插件入口index.browser.mjs的存在见 packages/plugin-oxc/package.json 的exports字段prettier/plugin-oxc 也可以作为浏览器端 standalone 插件使用——例如在 Prettier 的 playground、在线编辑器中将 Oxc 作为 JS/TS 的解析引擎。浏览器场景下的接入方式与配置文件的写法一致只需要在加载standalone.js后注册该插件对象即可。七、验证与排障建议确认版本执行npx prettier --version确保 3.6.0插件包版本建议以--exact锁定。确认解析器生效运行npx prettier --parser oxc test.js或npx prettier --parser oxc-ts test.ts单独验证也可通过npx prettier --debug-check检查格式化往返是否稳定。配置文件语法prettier.config.mjs使用 ESM 语法import/export default若项目是 CommonJS可将文件名改为prettier.config.cjs并改用require。覆盖规则未生效检查overrides中的 glob 是否与实际文件扩展名匹配并确保每个条目都携带plugins。八、小结prettier/plugin-oxc 展示了 Prettier 插件体系“解析与打印解耦”的设计思路通过 packages/plugin-oxc/index.js 将 Rust 版 Oxc 解析器接入产出estree-oxc格式的 AST再复用内置 estree 打印机完成输出。实际使用中只需两步yarn add --dev --exact prettier prettier/plugin-oxc安装然后在prettier.config.mjs中按需注册插件全局或通过overrides显式指定oxc/oxc-ts解析器。注意 Prettier 版本需不低于 3.6.0。如需进一步深入可以继续阅读插件源码 packages/plugin-oxc/index.js、解析器实现 src/language-js/parse/oxc.js、AST 后处理 src/language-js/parse/postprocess/index.js 以及语言声明映射 packages/plugin-oxc/languages.evaluate.js了解插件与内置解析器在架构上的对应关系。【免费下载链接】prettierPrettier is an opinionated code formatter.项目地址: https://gitcode.com/gh_mirrors/pr/prettier创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
 API 完全指南：绕过对象存储的 GPU 张量直传)
