Babel 中不存在官方“Pre-preset”概念，所谓“自定义 Pre-preset”实为可复用的 npm 包（如 @myorg/babel-preset-base），它导出符合 Babel 协议的函数，预封装插件与 preset 逻辑，开箱即用、支持选项扩展，并通过 presets 字段直接引用。
在 Babel 中，并没有官方定义的 “Pre-preset” 概念，但你提到的“自定义 Pre-preset 配置包”，通常是指一个可复用、提前封装好插件与 preset 逻辑的 npm 包（比如 @myorg/babel-preset-base），它被设计为在用户项目中通过 presets 字段直接引用，且本身**不依赖用户传参就能开箱即用**——也就是所谓“预设好的 preset”。这类包本质是标准的 Babel preset，只是命名和用途强调“预先配置好”，常用于团队统一规范或框架配套工具链。
1. 创建一个标准的 Babel preset 包
所谓“Pre-preset”，就是导出一个符合 Babel 插件/预设协议的函数或对象。Babel 会自动调用它，传入 { presets, plugins, ... } 等上下文参数（如 api 对象）。
- 新建 npm 包（如
my-babel-preset），初始化package.json，设置"main": "index.js" -
index.js导出一个函数（推荐），接收api和options参数：
module.exports = function (api, options = {}) {
// 启用缓存（强烈建议）
api.cache(true);
const env = api.env();
const isDevelopment = env === 'development';
return {
presets: [
// 核心 preset（如 @babel/preset-env）
['@babel/preset-env', {
targets: { browsers: ['> 1%', 'last 2 versions'] },
modules: false,
shippedProposals: true
}],
'@babel/preset-react',
'@babel/preset-typescript'
],
plugins: [
// 开发环境专用插件
isDevelopment && 'react-refresh/babel',
// 其他通用插件
'@babel/plugin-proposal-class-properties',
'@babel/plugin-transform-runtime'
].filter(Boolean)
};
};
2. 支持用户覆盖或扩展配置
虽然叫“Pre-preset”，但最好保留一定灵活性。Babel preset 函数的 options 参数允许用户在 .babelrc 或 babel.config.js 中传入定制项。
- 例如支持传入
reactRuntime或loose选项：
module.exports = function (api, options = {}) {
api.cache(true);
const { reactRuntime = 'automatic', loose = false } = options;
return {
presets: [
['@babel/preset-env', { loose, targets: { browsers: ['> 1%'] } }],
['@babel/preset-react', { runtime: reactRuntime }]
],
plugins: [
['@babel/plugin-proposal-decorators', { legacy: true }],
'@babel/plugin-proposal-optional-chaining'
]
};
};
使用时：{"presets": ["my-babel-preset", {"reactRuntime": "classic"}]}
Java项目代码review工具。分析Git变更+完整调用链路上下文，推断业务需求，进行多维度评分和分类汇总，生成完整PRD文档。包含细粒度Java代码审查清单（Null安全、异常处理、Streams、并发、equals/hashCode、资源管理、API设计、性能、MyBatis/ORM、事务边界、SQL/DD...
立即学习“Java免费学习笔记（深入）”；
3. 发布为可安装的 npm 包
确保包具备以下要素，才能被其他项目正确识别为 Babel preset：
- 导出函数或对象（不能是 ES 模块默认导出，除非同时提供
exports字段兼容 CJS） -
package.json中声明"type": "commonjs"（推荐），或同时提供exports映射 - 包含
peerDependencies，列出所依赖的 Babel 包（如@babel/core、@babel/preset-env），避免版本冲突 - 发布前运行
npm publish（注意 scope、access 权限等）
4. 在项目中使用你的 Pre-preset
安装后，像使用任何 Babel preset 一样引入即可：
// babel.config.js
module.exports = {
presets: [
'my-babel-preset', // 自动解析为 require('my-babel-preset')
// 或带选项：['my-babel-preset', { loose: true }]
]
};
如果 preset 内部已处理好环境判断、缓存、插件条件加载，用户就无需再手动写逻辑 —— 这正是“Pre-preset”的价值：把最佳实践打包成一行配置。
