NodeJS迁移Deno：如何区分前端TS配置与Deno默认TS检查器

核心思路 #

让Deno仅负责服务端代码的检查、lint和格式化，前端src/目录交由标准tsc处理，通过精准配置Deno和VSCode的语言服务实现隔离。

具体步骤 #

1. 调整Deno配置，避免全局排除src #

修改项目根目录的deno.json，不要使用顶级的"exclude"（会导致VSCode完全忽略该目录的TS检查），而是针对Deno的特定任务单独排除src/：

{
  "lint": {
    "exclude": ["src/"]
  },
  "fmt": {
    "exclude": ["src/"]
  },
  "test": {
    "exclude": ["src/"]
  },
  "compilerOptions": {
    // 保留服务端的TS编译配置，例如：
    "target": "ESNext",
    "module": "ESNext"
  }
}

这样Deno只会跳过src/目录的lint、格式化和测试，不会影响VSCode对该目录的TS语法检查。

2. 为前端目录配置独立的TS规则 #

在src/目录下创建tsconfig.json，根据前端构建工具（Rollup/Webpack）的需求配置编译规则，比如允许无后缀导入、支持CSS/HTML模块等：

{
  "compilerOptions": {
    "target": "ESNext",
    "module": "ESNext",
    "moduleResolution": "bundler",
    "allowImportingTsExtensions": false,
    "resolveJsonModule": true,
    "esModuleInterop": true,
    "strict": true,
    // 若使用Vite等工具，可直接引入对应类型声明
    "types": ["vite/client"]
  },
  "include": ["**/*"]
}

3. 配置VSCode语言服务隔离 #

在项目的.vscode/settings.json中设置，让src/目录使用标准TypeScript语言服务，根目录其他文件使用Deno服务：

{
  "deno.enable": true,
  "deno.disablePaths": ["src/"],
  // 指定前端使用项目本地的TypeScript版本
  "typescript.tsdk": "node_modules/typescript/lib",
  "typescript.enablePromptUseWorkspaceTsdk": true,
  // 为前端TS文件指定标准TS格式化工具
  "[typescript]": {
    "editor.defaultFormatter": "vscode.typescript-language-features"
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "vscode.typescript-language-features"
  }
}

4. 补充前端模块类型声明（可选） #

如果前端导入CSS/HTML文件时TS报错，在src/目录下创建类型声明文件：

• src/types/css.d.ts：

declare module "*.css" {
  const styles: Record<string, string>;
  export default styles;
}

• src/types/html.d.ts：

declare module "*.html" {
  const content: string;
  export default content;
}

然后在src/tsconfig.json的include中添加"types/**/*"，让TS识别这些模块。

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