如何搭建可本地共享的简单yarn包 实现短路径模块导入

1. 修改共享包的package.json #

在你的共享包根目录的package.json中新增exports和typesVersions字段，直接映射子路径到对应的源码文件，不需要改动现有目录结构：

{
  "name": "myPackage",
  "version": "1.0.0",
  // 原有配置保持不变，新增以下内容
  "exports": {
    // 通配符写法，自动匹配所有生成的文件，不需要逐个配置
    "./*": "./src/generated/*.js"
    // 如果需要逐个控制，也可以单独写：
    // "./abc": "./src/generated/abc.js",
    // "./def": "./src/generated/def.js"
  },
  "typesVersions": {
    // 适配TypeScript的类型查找规则
    "*": {
      "*": ["./src/generated/*.d.ts"]
      // 同样支持逐个配置：
      // "abc": ["./src/generated/abc.d.ts"],
      // "def": ["./src/generated/def.d.ts"]
    }
  }
}

2. 调整使用方项目的TS配置 #

在引入myPackage的业务项目的tsconfig.json中，确保compilerOptions下的moduleResolution配置为bundler、node16或nodenext，旧版的node解析规则不支持package.json的exports字段：

{
  "compilerOptions": {
    "moduleResolution": "bundler", // 使用Vite、Webpack等构建工具时优先选这个
    // 其余原有配置保持不变
  }
}

3. 刷新依赖缓存 #

修改完配置后重新链接包，避免本地缓存导致配置不生效：

• 在使用方项目执行 yarn remove myPackage
• 重新执行安装命令 yarn add link:/path/to/your/myPackage
• 如果你使用VS Code，按下Ctrl+Shift+P执行「TypeScript: Restart TS Server」重启TS语言服务

配置完成后即可直接通过import * from "myPackage/abc"的形式导入模块。

内容的提问来源于stack exchange，提问作者mr.bjerre