unplugin-dts icon indicating copy to clipboard operation
unplugin-dts copied to clipboard

`rollupTypes: true` results in `Error: Internal Error: getResolvedModule() could not resolve module name "./myMainComponent"

Open jnachtigall opened this issue 3 years ago • 11 comments

Setting rollupTypes: true results in Error: Internal Error: getResolvedModule() could not resolve module name ...

image

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import dts from "vite-plugin-dts";
import { resolve } from "path";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    react(),
    dts({
      insertTypesEntry: true,
      rollupTypes: true,
    }),
  ],
  build: {
    lib: {
      // Could also be a dictionary or array of multiple entry points
      entry: resolve(__dirname, "src/mainWebComponent.ts"),
      formats: ["es"],
    },
    outDir: "dist-lib",
  },
});

Without or commenting out // rollupTypes: true, it works.

jnachtigall avatar Oct 12 '22 08:10 jnachtigall

@qmhc Same error still with version 1.6.6

My d.ts file is "types": "./dist-lib/ozgerde-vorgangsportal.d.ts", and includes:

export * from './mainWebComponent'

But there is no such file in dist-lib

image

jnachtigall avatar Oct 13 '22 12:10 jnachtigall

I think the cause maybe incorrect root config, would your tsconfig.json and project struct?

qmhc avatar Oct 13 '22 12:10 qmhc

That's my tsconfig.json:

{
  "compilerOptions": {
    "target": "ESNext",
    "useDefineForClassFields": true,
    "lib": ["DOM", "DOM.Iterable", "ESNext"],
    "allowJs": false,
    "skipLibCheck": true,
    "esModuleInterop": false,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "ESNext",
    "moduleResolution": "Node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx"
  },
  "include": ["src"],
  "references": [{ "path": "./tsconfig.node.json" }]
}

and tsconfig.node.json:

{
  "compilerOptions": {
    "composite": true,
    "module": "ESNext",
    "moduleResolution": "Node",
    "allowSyntheticDefaultImports": true
  },
  "include": ["vite-app.config.ts", "vite-lib.config.ts"]
}

Not sure, what you mean by "project struct"? It is a vite 3 structure under modules/vgp-frontend/vite-app and build.outDir: "dist-lib",

EDIT: This is the package.json:

{
  "name": "ozgerde-vorgangsportal",
  "private": true,
  "version": "1.0.0",
  "type": "module",
  "files": [
    "dist-lib"
  ],
  "module": "./dist-lib/ozgerde-vorgangsportal.js",
  "exports": {
    ".": {
      "import": "./dist-lib/ozgerde-vorgangsportal.js"
    }
  },
  "types": "./dist-lib/ozgerde-vorgangsportal.d.ts",
  "scripts": {
    "dev": "vite --config vite-app.config.ts",
    "build": "npm run buildApp && npm run buildLib",
    "buildApp": "tsc && vite --config vite-app.config.ts build",
    "buildLib": "tsc && vite --config vite-lib.config.ts build",
    "preview": "vite --config vite-app.config.ts preview"
  },
  "dependencies": {
    "@emotion/react": "^11.10.4",
    "@emotion/styled": "^11.10.4",
    "@mui/material": "^5.10.5",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "swr": "^1.3.0",
    "unfetch": "^4.2.0"
  },
  "devDependencies": {
    "@types/node": "^18.8.1",
    "@types/react": "^18.0.17",
    "@types/react-dom": "^18.0.6",
    "@vitejs/plugin-react": "^2.1.0",
    "rollup-plugin-typescript2": "^0.34.1",
    "typescript": "^4.6.4",
    "vite": "^3.1.0",
    "vite-plugin-dts": "^1.6.6"
  }
}

Error happens when calling npm run buildLib

jnachtigall avatar Oct 13 '22 12:10 jnachtigall

Changing in package.json from

  "types": "./dist-lib/ozgerde-vorgangsportal.d.ts",

to

  "types": "./dist-lib/mainWebComponent.d.ts",

makes it work.

Though now I have 2 files in the outputDir like this: image

That is, now there is a ozgerde-vorgangsportal.js and the d.ts file for it is not named after the package but is mainWebComponent.ts But should start like the package name ozgerde-vorgangsportal

jnachtigall avatar Oct 13 '22 12:10 jnachtigall

You add skipDiagnostics: false and logDiagnostics: true to plugin options and run build again, it there any type errors?

qmhc avatar Oct 13 '22 13:10 qmhc

Added these options, but I do not see any type errors in the output:

$ npm run buildLib

> [email protected] buildLib
> tsc && vite --config vite-lib.config.ts build

vite v3.1.0 building for production...
✓ 410 modules transformed.
dist-lib/ozgerde-vorgangsportal.js   126.24 KiB / gzip: 35.05 KiB

[vite:dts] Start generate declaration files...
[vite:dts] Start rollup declaration files...
error during build:
Error: Internal Error: getResolvedModule() could not resolve module name "./mainWebComponent"
/home/jnachtigall/dev/erd/ozg-erde-formcycle/modules/vgp-frontend/vite-app/dist-lib/ozgerde-vorgangsportal.d.ts:1:1

You have encountered a software defect. Please consider reporting the issue to the maintainers of this application.
    at ExportAnalyzer._fetchSpecifierAstModule (/home/jnachtigall/dev/erd/ozg-erde-formcycle/modules/vgp-frontend/vite-app/node_modules/@microsoft/api-extractor/lib/analyzer/ExportAnalyzer.js:676:19)
    at ExportAnalyzer.fetchAstModuleFromSourceFile (/home/jnachtigall/dev/erd/ozg-erde-formcycle/modules/vgp-frontend/vite-app/node_modules/@microsoft/api-extractor/lib/analyzer/ExportAnalyzer.js:112:65)
    at AstSymbolTable.fetchAstModuleFromWorkingPackage (/home/jnachtigall/dev/erd/ozg-erde-formcycle/modules/vgp-frontend/vite-app/node_modules/@microsoft/api-extractor/lib/analyzer/AstSymbolTable.js:83:37)
    at Collector.analyze (/home/jnachtigall/dev/erd/ozg-erde-formcycle/modules/vgp-frontend/vite-app/node_modules/@microsoft/api-extractor/lib/collector/Collector.js:155:51)
    at rollupDeclarationFiles (file:///home/jnachtigall/dev/erd/ozg-erde-formcycle/modules/vgp-frontend/vite-app/node_modules/vite-plugin-dts/dist/index.mjs:176858:13)
    at Object.closeBundle (file:///home/jnachtigall/dev/erd/ozg-erde-formcycle/modules/vgp-frontend/vite-app/node_modules/vite-plugin-dts/dist/index.mjs:177171:11)
    at async Promise.all (index 0)
    at async PluginDriver.hookParallel (file:///home/jnachtigall/dev/erd/ozg-erde-formcycle/modules/vgp-frontend/vite-app/node_modules/rollup/dist/es/shared/rollup.js:22638:9)
    at async Object.close (file:///home/jnachtigall/dev/erd/ozg-erde-formcycle/modules/vgp-frontend/vite-app/node_modules/rollup/dist/es/shared/rollup.js:23709:13)
    at async Promise.all (index 0)

I think the build error is because within dist-lib there is ozgerde-vorgangsportal.d.ts whose content is:

export * from './mainWebComponent'

But in dist-lib there is no mainWebComponent.ts file. Hence it cannot be resolved. Only in src/ this file exists

jnachtigall avatar Oct 13 '22 13:10 jnachtigall

Just strange, Would you mind sharing your project or provide a reproduction?

qmhc avatar Oct 13 '22 13:10 qmhc

I've set up a repo at https://github.com/jnachtigall/vite-plugin-dts-126-bug and sent you an invitation. You can toggle rollupTypes: true to make it work / not work. Do npm install then npm run buildLib to get the error. See package.json for the used scripts.

jnachtigall avatar Oct 13 '22 14:10 jnachtigall

I see there is not any export in mainWebComponent.ts, so it will not be a module in typescript.

qmhc avatar Oct 13 '22 14:10 qmhc

yes, the plan is that the lib is used in the consuming app with import "ozgerde-vorgangsportal" (which works) and then you can use the web component as <ozgerde-vorgangsportal></ozgerde-vorgangsportal> (also works, if one ignores the JSX declaration typescript error). So to avoid the JSX error the src/webcomponent-custom-element.d.ts needs to be exported. But this rather concerns #127

Even there's no export, the process should not error.

jnachtigall avatar Oct 13 '22 14:10 jnachtigall

You need to export something to make it as a moudle, such as export default WebComponent.

qmhc avatar Oct 13 '22 14:10 qmhc