vite-tsconfig-paths: Unable to resolve transitive path

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 😃