aleclarson / vite-tsconfig-paths

Support for TypeScript's path mapping in Vite
MIT License
1.24k stars 43 forks source link

Unable to resolve dependency of dependency #61

Closed Aaronius closed 1 year ago

Aaronius commented 2 years ago

Here's my setup. I have a monorepo. In that monorepo, I have @taxbit/demos which uses @taxbit/browser which uses @taxbit/rest (all three are on the same repo). When I run vite on @taxbit/demos, I get the following error:

✘ [ERROR] [plugin vite:dep-scan] Failed to resolve entry for package "@taxbit/rest". The package may have incorrect main/module/exports specified in its package.json: Failed to resolve entry for package "@taxbit/rest". The package may have incorrect main/module/exports specified in its package.json.

    ../../node_modules/vite/dist/node/chunks/dep-8f5c9290.js:40945:10:
      40945 │     throw new Error(`Failed to resolve entry for package "${id}". ` +
            ╵           ^

    at packageEntryFailure (/Users/aaron/dev/taxbit-browser/node_modules/vite/dist/node/chunks/dep-8f5c9290.js:40945:11)
    at resolvePackageEntry (/Users/aaron/dev/taxbit-browser/node_modules/vite/dist/node/chunks/dep-8f5c9290.js:40941:9)
    at tryNodeResolve (/Users/aaron/dev/taxbit-browser/node_modules/vite/dist/node/chunks/dep-8f5c9290.js:40748:20)
    at Context.resolveId (/Users/aaron/dev/taxbit-browser/node_modules/vite/dist/node/chunks/dep-8f5c9290.js:40556:28)
    at Object.resolveId (/Users/aaron/dev/taxbit-browser/node_modules/vite/dist/node/chunks/dep-8f5c9290.js:39229:55)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async resolve (/Users/aaron/dev/taxbit-browser/node_modules/vite/dist/node/chunks/dep-8f5c9290.js:39441:26)
    at async /Users/aaron/dev/taxbit-browser/node_modules/vite/dist/node/chunks/dep-8f5c9290.js:39601:34
    at async callback (/Users/aaron/dev/taxbit-browser/node_modules/esbuild/lib/main.js:929:28)
    at async handleRequest (/Users/aaron/dev/taxbit-browser/node_modules/esbuild/lib/main.js:709:30)

  This error came from the "onResolve" callback registered here:

    ../../node_modules/vite/dist/node/chunks/dep-8f5c9290.js:39591:18:
      39591 │             build.onResolve({
            ╵                   ~~~~~~~~~

    at setup (/Users/aaron/dev/taxbit-browser/node_modules/vite/dist/node/chunks/dep-8f5c9290.js:39591:19)
    at handlePlugins (/Users/aaron/dev/taxbit-browser/node_modules/esbuild/lib/main.js:851:23)
    at Object.buildOrServe (/Users/aaron/dev/taxbit-browser/node_modules/esbuild/lib/main.js:1145:7)
    at /Users/aaron/dev/taxbit-browser/node_modules/esbuild/lib/main.js:2087:17
    at new Promise (<anonymous>)
    at Object.build (/Users/aaron/dev/taxbit-browser/node_modules/esbuild/lib/main.js:2086:14)
    at Object.build (/Users/aaron/dev/taxbit-browser/node_modules/esbuild/lib/main.js:1935:51)
    at /Users/aaron/dev/taxbit-browser/node_modules/vite/dist/node/chunks/dep-8f5c9290.js:39389:54
    at Array.map (<anonymous>)

  The plugin "vite:dep-scan" was triggered by this import

    ../sdk/src/TaxBit.ts:9:23:
      9 │ import TaxBitRest from "@taxbit/rest";
        ╵                        ~~~~~~~~~~~~~~

Build failed with 1 error:
../../node_modules/vite/dist/node/chunks/dep-8f5c9290.js:40945:10: ERROR: [plugin: vite:dep-scan] Failed to resolve entry for package "@taxbit/rest". The package may have incorrect main/module/exports specified in its package.json: Failed to resolve entry for package "@taxbit/rest". The package may have incorrect main/module/exports specified in its package.json.

Here are my files:

@taxbit/demos 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,
    "incremental": true,
    "jsx": "react-jsx",
    "baseUrl": "./",
    "paths": {
      "~/*": ["./src/*"],
      "@taxbit/browser": ["../sdk/src/main.ts"],
      "@taxbit/rest": ["../rest/src/main.ts"]
    }
  },
  "include": ["src"]
}

@taxbit/demos vite.config.json

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import tsconfigPaths from "vite-tsconfig-paths";

export default defineConfig({
  plugins: [tsconfigPaths(), react()],
});

@taxbit/browser tsconfig.json:

{
  "compilerOptions": {
    "target": "ESNext",
    "useDefineForClassFields": true,
    "module": "ESNext",
    "lib": ["ESNext", "DOM"],
    "moduleResolution": "Node",
    "strict": true,
    "sourceMap": true,
    "resolveJsonModule": true,
    "esModuleInterop": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noImplicitReturns": true,
    "noUncheckedIndexedAccess": true,
    "declaration": true,
    "emitDeclarationOnly": true,
    "baseUrl": "./",
    "rootDir": "./src",
    "outDir": "./dist",
    "paths": {
      "@taxbit/rest": ["../rest/src/main.ts"]
    },
    "composite": true
  },
  "include": ["./src"],
  "references": [
    {
      "path": "../rest"
    }
  ]
}

@taxbit/browser vite.config.json:

import { defineConfig } from "vite";
import tsconfigPaths from "vite-tsconfig-paths";

export default defineConfig({
  plugins: [tsconfigPaths()],
  build: {
    lib: {
      entry: "./src/main.ts",
      name: "taxbit",
      fileName: (format) => `taxbit.${format}.js`,
    },
  },
});

@taxbit/rest tsconfig.json:

{
  "compilerOptions": {
    "target": "ESNext",
    "useDefineForClassFields": true,
    "module": "ESNext",
    "lib": ["ESNext", "DOM"],
    "moduleResolution": "Node",
    "strict": true,
    "sourceMap": true,
    "resolveJsonModule": true,
    "esModuleInterop": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noImplicitReturns": true,
    "noUncheckedIndexedAccess": true,
    "declaration": true,
    "rootDir": "./src",
    "outDir": "./dist",
    "composite": true
  },
  "include": ["./src"]
}

@taxbit/rest vite.config.json:

import { defineConfig } from "vite";
import tsconfigPaths from "vite-tsconfig-paths";

export default defineConfig({
  plugins: [tsconfigPaths()], // probably not necessary
  build: {
    lib: {
      entry: "./src/main.ts",
      name: "taxbit",
      fileName: (format) => `taxbit.${format}.js`,
    },
  },
});

When I don't use vite-tsconfig-paths, but instead manually configure resolve.alias within vite.config.json, I don't get an error. Here's what my vite.config.json files look like when manually configured:

@taxbit/demos vite.config.json:

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import * as path from "path";

export default defineConfig({
  plugins: [react()],
  resolve: {
    alias: {
      "~": path.resolve(__dirname, "src"),
      "@taxbit/browser": path.resolve(__dirname, "../sdk/src/main.ts"),
      "@taxbit/rest": path.resolve(__dirname, "../rest/src/main.ts"),
    },
  },
});

@taxbit/browser vite.config.json

import { defineConfig } from "vite";
import * as path from "path";

export default defineConfig({
  resolve: {
    alias: {
      "@taxbit/rest": path.resolve(__dirname, "../rest/src/main.ts"),
    },
  },
  build: {
    lib: {
      entry: "./src/main.ts",
      name: "taxbit",
      fileName: (format) => `taxbit.${format}.js`,
    },
  },
});

@taxbit/rest vite.config.json

import { defineConfig } from "vite";

export default defineConfig({
  build: {
    lib: {
      entry: "./src/main.ts",
      name: "taxbit",
      fileName: (format) => `taxbit.${format}.js`,
    },
  },
});

I'm still pretty new at configuring TS and Vite, so it's very possible I'm misunderstanding something. Thanks for the help!

tquinlan1992 commented 1 year ago

I believe I have the same error

  1. When I don't set up vite-tsconfig-paths I get an error importing 'b' in the file in a/index.ts

  2. When I have vite-tsconfig-paths set up I get an error import package 'c' in package 'b'

So it seems vite-tsconfig-paths is working for the first "layer" of import from a separate package, but is then having an issue importing another package within the first dependency

aleclarson commented 1 year ago

@Aaronius Vite only loads the nearest vite.config.js file. The others aren't loaded. You can use the root option to help the plugin find your other tsconfig.json files. From the stack trace, it looks like your packages (other than @foo/demos) are being optimized by Vite, which might prevent root from working (but maybe not a problem).

https://github.com/aleclarson/vite-tsconfig-paths/wiki/Troubleshooting#you-may-need-the-root-option