TS7016: Could not find a declaration file for module 'single-spa-vue'

[webJose]

I am getting the following error in a Vue + Vite project:

error TS7016: Could not find a declaration file for module 'single-spa-vue'. 'C:/Users/xxx/src/vue-mife01/node_modules/single-spa-vue/dist/esm/single-spa-vue.js' implicitly has an 'any' type.

There are types at 'C:/Users/xxx/src/vue-mife01/node_modules/single-spa-vue/types/single-spa-vue.d.ts', but this result could not be resolved when respecting package.json "exports". The 'single-spa-vue' library may need to update its package.json or typings.

This error prevents building the application.

I found a workaround:

1. Create a new folder in the root of the project. Name it something like typings, or custom-typings.
2. Create a sub-folder named single-spa-vue.
3. Copy into this sub-folder the file node_modules/single-spa-vue/types/single-spa-vue.d.ts and rename it to index.d.ts.
4. Edit the project's tsconfig.json file to include the paths property under compilerOptions to include this custom typings folder. Something like this:

{
  "compilerOptions": {
    "paths": {
      "*": [ "./custom-typings/*" ]
    },
    ...
  }
}

Unrelated question: Is this project abandoned? No updates for 2 years.

[AkaiVAC]

I had the same issue and found a solution through stackoverflow. This seems to be a Typescript behavior as described in the docs here.

The fix seems to be to add a reference to the types within the exports property as well:

  "module": "dist/esm/single-spa-vue.js",
  "exports": {
    ".": {
      "types": "./types/single-spa-vue.d.ts", // <-- Adding this fixes the issue
      "import": "./dist/esm/single-spa-vue.js",
      "require": "./dist/umd/single-spa-vue.js"
    },

I tried it locally and it seems to work as expected. I'll create a pull request for it.

Note that I am using ESM and haven't tested for commonjs.