使用Yarn Workspaces导入共享JS组件VSCode报type any错误如何解决

以下是针对纯JS Yarn Workspaces项目VSCode报跨包导入any类型错误的修复步骤：

1. 配置各包的jsconfig.json #

在app、electron、shared三个包的根目录分别新增jsconfig.json文件，配置模块解析规则，示例配置（适配packages/下存放三个包的目录结构）：

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "shared/*": ["../shared/*"]
    },
    "module": "ESNext",
    "moduleResolution": "Node",
    "target": "ESNext",
    "jsx": "react",
    "allowSyntheticDefaultImports": true,
    "checkJs": false,
    "noImplicitAny": false
  },
  "include": ["src/**/*", "../shared/**/*"]
}

注意：根据你的实际目录结构调整paths和include的相对路径

2. 确认workspace依赖配置 #

在app和electron包的package.json中，将shared声明为 workspace 依赖，保证模块能被正确定位：

{
  "dependencies": {
    "shared": "workspace:*"
  }
}

3. 可选：添加极简类型声明 #

如果需要保留JS文件的类型提示不关闭checkJs，可以在shared包根目录新增index.d.ts文件，声明导出组件的类型：

declare module 'shared/components/Header' {
  import React from 'react';
  const Header: React.FC;
  export default Header;
}

4. 重启编辑器服务 #

配置完成后按Ctrl+Shift+P（Mac系统按Cmd+Shift+P），执行「TypeScript: 重启TS服务器」命令，等待服务重启后报错就会消失。

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