如何通过NX、TS配置或ESLint强制使用作用域包导入并禁止根目录导入？

一、用 NX 内置 ESLint 规则（推荐） #

NX 自带的 @nx/enforce-module-boundaries 规则专门用于管控模块导入边界，完全适配你的需求。修改项目根目录的 .eslintrc.json（或 .eslintrc.js），添加以下配置：

"rules": {
  "@nx/enforce-module-boundaries": [
    "error",
    {
      "restrictedPaths": [
        {
          "source": "*",
          "target": "apps/**",
          "message": "禁止直接从apps路径导入，请使用@us/xxx这类作用域包名"
        },
        {
          "source": "*",
          "target": "libs/**/src",
          "message": "禁止直接从lib的src路径导入，请使用@us/lib-xxx这类作用域包名"
        }
      ],
      "enforceBuildableLibDependency": true,
      "depConstraints": [{"sourceTag": "*", "onlyDependOnLibsWithTags": ["*"]}]
    }
  ]
}

配置后，任何直接从 apps/ 或 libs/*/src/ 导入的代码都会触发ESLint错误，同时给出明确提示。

二、ESLint 通用规则兜底（非NX项目也可用） #

如果NX内置规则未生效，可使用 eslint-plugin-import 的 no-restricted-paths 规则实现同样效果：

1. 确保已安装依赖：

npm install eslint-plugin-import --save-dev

2. 在ESLint配置中添加规则：

"rules": {
  "import/no-restricted-paths": [
    "error",
    {
      "forbidden": [
        {
          "target": "^apps/.*$",
          "message": "禁止直接从apps路径导入，请使用@us/xxx这类作用域包名"
        },
        {
          "target": "^libs/[^/]+/src/.*$",
          "message": "禁止直接从lib的src路径导入，请使用@us/lib-xxx这类作用域包名"
        }
      ]
    }
  ]
}

三、TypeScript 配置强化 #

确保 tsconfig.base.json 中的路径映射配置正确，让IDE能识别并优先提示作用域包名：

"compilerOptions": {
  "baseUrl": ".",
  "paths": {
    "@us/*": ["libs/*/src/index.ts"],
    "@us/app-*": ["apps/*/src/index.ts"]
  }
}

注意每个lib/app的入口文件（index.ts）要正确导出需要对外暴露的内容，这样作用域包名才能正确映射到对应模块。

四、IDE 自动导入优化 #

解决IDE自动导入的问题，以VS Code为例，修改用户设置（settings.json）：

"typescript.preferences.importModuleSpecifier": "non-relative",
"typescript.preferences.preferTypeOnlyAutoImports": false,
"typescript.suggest.paths": true

配置后，IDE会优先选择你配置的作用域别名作为自动导入的路径，而非直接的文件路径。

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