vite-tsconfig-paths: Unable to resolve transitive path

Maintainer note: See this comment for a solution.


Hey Alec,

I’ve just given this lib a spin and hit an issue in my mono repo where a mapped path tries to load another module in a mapped path and fails.

Here is the example:

/apps/frontend /libs/lib1 /libs/lib2

The libs have names/path mappings of @libs/lib1 and @libs/lib2 for instance.

Frontend loads lib1 fine, but lib1 tries to import lib2 and it can’t resolve.

I’ve tracked the issue down to isLocalDescendant. My tsconfig is in /apps/frontend, but because the importer is @libs/lib1 it thinks that lib2 is not a local descendant and it fails to resolve.

Solutions?

I basically need to be able to specify the root as the repo base (ie cwd()), and the tsconfigRoot as two separate options.

Possible non-breaking change, add a baseDir option? Naming is hard, especially with the current value being called root.

Ideas?

About this issue

  • Original URL
  • State: closed
  • Created 3 years ago
  • Comments: 21 (9 by maintainers)

Most upvoted comments

In v3.3.0, you should do the following:

  • set the root option to point at the common ancestor shared by all projects whose tsconfig.json files you want this plugin to use
  • leave the projects option undefined
tsconfigPaths({
  root: '../..',
})

I’ve tested with @jamos99’s demo, and it works as expected. 😃

I had the same issue. I created a new Nx workspace and created an app with the @nxext/vite package, then a few libraries using @nrwl/js. Similar to the original post in this thread, the app depended on some libraries that then depended on other libraries within the workspace. When I tried to run the vite app by running nx serve my-vite-app it failed complaining that vite couldn’t resolve the transitive dependencies.

In case anyone runs into this as well, to fix it I had to do all of the following (based on notes in this thread and elsewhere):

  1. add a tsconfig.json file to the root of the workspace (e.g. /tsconfig.json) extending the base tsconfig generated by Nx:
{
  "extends": "./tsconfig.base.json",
}
  1. add a vite.config.ts file to the vite app (e.g. /apps/my-vite-app/vite.config.ts) containing the following (note that it provides a root property for the vite-tsconfig-paths plugin pointing from the app’s directory to the root of the workspace:
import { defineConfig } from "vite"
import tsconfigPaths from "vite-tsconfig-paths"

export default defineConfig({
  plugins: [
    tsconfigPaths({
      root: "../..",
    }),
  ],
  build: {
    target: "esnext",
  },
})
  1. update the vite app’s project.json file (e.g /apps/my-vite-app/project.json) to use the newly created vite.config.ts file instead of the one provided by @nxext/vite:
{
  ...
  "targets": {
    "build": {
      ...
      "options": {
        ...
-       "configFile": "@nxext/vite/plugins/vite"
+       "configFile": "apps/my-vite-app/vite.config.ts"
      },
      ...
    },
    "serve": {
      ...
      "options": {
        ...
-       "configFile": "@nxext/vite/plugins/vite"
+       "configFile": "apps/my-vite-app/vite.config.ts"
      },
      ...
    },
    ...
  },
  ...
}

If I don’t do any part of the above I get the transitive dependencies error described in the original post and elsewhere, so I understand all are required to hook vite up to how Nx organises the workspace.

I ran into this issue with an nx monorepo, which for all intents and purposes uses Typescript paths for library resolution.

I created a demo at https://github.com/jamos99/vite-tsconfig-paths-demo using 3.2.1. It seems that paths resolve just fine if both libraries are used directly, but fail if one of the libs is only transitively imported (e.g. my-lib2 imports my-lib1).

@mwarnerdotme You’re facing another issue, specifically a bug in tsconfig-paths (https://github.com/dividab/tsconfig-paths/issues/new)

Basically, the include in apps/my-app/tsconfig.app.json is being overwritten by the include in apps/my-app/tsconfig.json

I’d think it would be possible to infer the typescript root project, which would remove the need for root in this situation at all.

PR welcome 😃