Yarn工作区下Svelte+Rollup无法引入common目录TS文件问题咨询

基于 npm/yarn workspaces 的 monorepo 项目，结构如下：

- root
| - package.json
| - frontend
  | - index.svelte
  | - rollup.config.js
  | - package.json
| - backend
  | - index.ts
  | - package.json
| - common
  | - status.ts 
  | - package.json

各文件现有配置 #

根目录配置 root/package.json #

{
    "private": true,
    "workspaces": [
        "backend",
        "common",
        "frontend"
    ]
}

前端包配置 root/frontend/package.json #

{
  "name": "my-project-frontend",
  "dependencies": {
    "my-project-common": "^0.1.3",
  }
}

公共包配置 root/common/package.json #

{
    "name": "my-project-common",
    "version": "0.1.4"
}

公共包源码 root/common/status.ts #

export const StatusLabel = {
    CREATED: 'CREATED',
    QUEUED: 'QUEUED',
    RUNNING: 'RUNNING',
    FINNISHED: 'FINNISHED'
}

前端代码引用 root/frontend/index.svelte #

import { StatusLabel } from "my-project-common/status";

构建报错 #

执行前端构建时，Rollup 提示依赖无法解析：

(!) Unresolved dependencies
my-project-common/status (imported by index.svelte)

第一步：修正工作区依赖版本匹配问题 #

当前前端包声明的my-project-common版本范围是^0.1.3，但本地公共包版本是0.1.4，部分包管理器会因为版本匹配逻辑异常，没有正确建立本地包的软链，反而去 npm 公共仓库找对应版本的包，自然找不到本地编写的status.ts。
直接把前端依赖里的版本改成通配符，确保走本地工作区链接：
修改root/frontend/package.json的依赖段：

"dependencies": {
  "my-project-common": "*"
}

改完在根目录执行安装命令，确认node_modules/my-project-common是指向本地common文件夹的软链接，不是从远程拉取的实体文件夹。

第二步：给公共包补全路径导出规则 #

当前common/package.json没有任何入口声明，Rollup 拿到my-project-common/status这个导入路径后，根本不知道这个路径对应本地的哪个文件。
直接在common/package.json里加exports字段做路径映射：

{
    "name": "my-project-common",
    "version": "0.1.4",
    "exports": {
      "./status": "./status.ts"
    }
}

第三步：调整 Rollup 配置适配本地源码解析 #

默认 Rollup 只会在当前项目的node_modules目录下找编译好的产物，不会跨目录去读其他工作区的 TS 源码，需要安装两个配套插件：

npm install -D @rollup/plugin-node-resolve @rollup/plugin-typescript

然后修改root/frontend/rollup.config.js：

import path from 'path';
import resolve from '@rollup/plugin-node-resolve';
import typescript from '@rollup/plugin-typescript';

export default {
  input: 'index.svelte',
  output: {
    // 保留原有输出配置
  },
  plugins: [
    resolve({
      // 不保留软链，直接解析本地实际源码路径
      preserveSymlinks: false,
      // 额外把 common 目录加入解析搜索范围
      moduleDirectories: ['node_modules', path.resolve(__dirname, '../common')]
    }),
    typescript({
      // 允许编译 common 目录下的 TS 文件，不被默认的 include 范围拦截
      include: ['**/*.ts', path.resolve(__dirname, '../common/**/*.ts')]
    })
    // 保留原有 Svelte 编译插件配置
  ]
}

额外提醒 #

如果用的是 Vite 替代原生 Rollup 做前端构建，不需要改底层 Rollup 配置，只要在vite.config.js里加一行配置关掉软链拦截即可：

export default {
  resolve: {
    preserveSymlinks: false
  }
}

内容的提问来源于stack exchange，提问作者Finnepinnen