VSCode IntelliSence 不知道 package.json 中的 `exports`

Question

我正在使用一个名为sinulous的库，它有一个子模块“sinulous/map”。

VSCode 不知道

map

中

import { map } from "sinuous/map"

的类型，但它知道

import { map } from "sinuous/src/map"

中的类型。

我正在使用 vite 编写支持 ESM 的前端 vanilla JS。当我写

import { map } from "sinuous/src/map"

时，vite不高兴了：

20:49:07 [vite] page reload user-list.js
20:49:07 [vite] Internal server error: Missing "./map.js" specifier in "sinuous" package
  Plugin: vite:import-analysis
  File: D:/dev/web/neohcpp-z/user-list.js

这是sinious的文件树：

sinuous
│  package.json
│  README.md
│
├─dist
│      babel-plugin-htm.cjs
│
└─src
        .eslintrc.yml
        babel-plugin-htm.js
        babel-plugin-htm.md
        h.d.ts
        h.js
        htm.js
        hydrate.d.ts
        hydrate.js
        hydrate.md
        index.d.ts
        index.js
        jsx.d.ts
        map.d.ts
        map.js
        observable.d.ts
        observable.js
        observable.md
        shared.d.ts
        template.d.ts
        template.js
        template.md

这是蜿蜒的

package.json

的一部分（在我的

node_modules

中）：

{
  "name": "sinuous",
  "version": "0.32.1",
  "description": "🧬 Small, fast, reactive render engine",
  "module": "src/index.js",
  "main": "src/index.js",
  "types": "src/index.d.ts",
  "type": "module",
  "exports": {
    ".": {
      "import": "./src/index.js"
    },
    "./h": {
      "import": "./src/h.js"
    },
    "./babel-plugin-htm": {
      "import": "./src/babel-plugin-htm.js",
      "require": "./dist/babel-plugin-htm.cjs"
    },
    "./htm": {
      "import": "./src/htm.js"
    },
    "./hydrate": {
      "import": "./src/hydrate.js"
    },
    "./map": {
      "import": "./src/map.js"
    },
    "./observable": {
      "import": "./src/observable.js"
    },
    "./template": {
      "import": "./src/template.js"
    }
  },
  "files": [
    "src",
    "dist",
    "!**/test/**"
  ],
  //...
}

因此，当我使用路径导入时，VSCode 会看到

map.d.ts

，但当我使用

sinuous/map

导入时却看不到。

为了让 vite 开心，我必须

import { map } from "sinuous/map"

（这显然也更优雅），但是 VSCode 不知道类型。

我用过

tsconfig.json

:

{
  "compilerOptions": {
    "module": "NodeNext",
    "moduleResolution": "NodeNext"
  }
}

这确实让 TSC 很高兴，TSC 可以看到

map.d.ts

，当我在

map

文件中导入

.ts

时，VSCode 知道

map

的类型。但在

.js

文件中，它不起作用。

Answer 1

也许这已经解决了。

jsconfig.json

：

{
  "compilerOptions": {
    "module": "nodenext"
  }
}

参考资料：

• https://github.com/microsoft/TypeScript/issues/56412