Nx vite cannot load a vite plugin but the official scaffold loads the same plugin successfully

dearlordylord commented 3 months ago

Current Behavior

I'm importing import UnpluginTypia from '@ryoppippi/unplugin-typia/vite' in vite.config.ts

nx serve gives

Failed to process project graph. Run "nx reset" to fix this. Please report the issue if you keep seeing it.
  AggregateCreateNodesError: An error occurred while processing files for the @nx/vite/plugin plugin.
    - apps/typia/vite.config.ts: Build failed with 1 error:
  node_modules/esbuild/lib/main.js:1225:27: ERROR: [plugin: externalize-deps] "@ryoppippi/unplugin-typia/vite" resolved to an ESM file. ESM file cannot be loaded by `require`. See https://vitejs.dev/guide/troubleshooting.html#this-package-is-esm-only for more details.
      at createNodesFromFiles (/Users/firfi/work/typia-nx/node_modules/nx/src/project-graph/plugins/utils.js:58:15)
      at processTicksAndRejections (node:internal/process/task_queues:95:5)
      at Array.createNodesV2 (/Users/firfi/work/typia-nx/packages/vite/src/plugins/plugin.ts:57:14)
      at LoadedNxPlugin.createNodes (/Users/firfi/work/typia-nx/node_modules/nx/src/project-graph/plugins/internal-api.js:31:36)
      at LoadedNxPlugin.createNodes.<computed> (/Users/firfi/work/typia-nx/node_modules/nx/src/project-graph/plugins/internal-api.js:41:28)
      at async Promise.all (index 1)
      at processFilesAndCreateAndSerializeProjectGraph (/Users/firfi/work/typia-nx/node_modules/nx/src/daemon/server/project-graph-incremental-recomputation.js:148:43)
      at Timeout._onTimeout (/Users/firfi/work/typia-nx/node_modules/nx/src/daemon/server/project-graph-incremental-recomputation.js:85:13)

however, a project created from https://vitejs.dev/guide/#scaffolding-your-first-vite-project (npm create vite@latest) imports the same plugin successfully and runs with npm run dev (ref: https://github.com/dearlordylord/typia-vite , don't mind README there, it's related to a runtime error in their plugin)

Expected Behavior

It serves without an error, like npm run dev runs in the official scaffold.

GitHub Repo

https://github.com/dearlordylord/typia-nx

Steps to Reproduce

npx create-nx-workspace
- "integrated monorepo", "react", "vite" option" selected
npx jsr add -D @ryoppippi/unplugin-typia
import UnpluginTypia from '@ryoppippi/unplugin-typia/vite' in vite.config.ts of the app

Nx Report

it doesn't work because `import UnpluginTypia from '@ryoppippi/unplugin-typia/vite'` cannot be imported:

➜  typia-nx git:(master) nx report

 NX   Failed to process project graph. Run "nx reset" to fix this. Please report the issue if you keep seeing it.

Pass --verbose to see the stacktraces.

➜  typia-nx git:(master) nx reset

 NX   Resetting the Nx cache and stopping the daemon.

 NX   Successfully reset the Nx workspace.

➜  typia-nx git:(master) nx report

 NX   Failed to process project graph. Run "nx reset" to fix this. Please report the issue if you keep seeing it.

Pass --verbose to see the stacktraces


### Failure Logs

```shell
Failed to process project graph. Run "nx reset" to fix this. Please report the issue if you keep seeing it.
  AggregateCreateNodesError: An error occurred while processing files for the @nx/vite/plugin plugin.
    - apps/typia/vite.config.ts: Build failed with 1 error:
  node_modules/esbuild/lib/main.js:1225:27: ERROR: [plugin: externalize-deps] "@ryoppippi/unplugin-typia/vite" resolved to an ESM file. ESM file cannot be loaded by `require`. See https://vitejs.dev/guide/troubleshooting.html#this-package-is-esm-only for more details.
      at createNodesFromFiles (/Users/firfi/work/typia-nx/node_modules/nx/src/project-graph/plugins/utils.js:58:15)
      at processTicksAndRejections (node:internal/process/task_queues:95:5)
      at Array.createNodesV2 (/Users/firfi/work/typia-nx/packages/vite/src/plugins/plugin.ts:57:14)
      at LoadedNxPlugin.createNodes (/Users/firfi/work/typia-nx/node_modules/nx/src/project-graph/plugins/internal-api.js:31:36)
      at LoadedNxPlugin.createNodes.<computed> (/Users/firfi/work/typia-nx/node_modules/nx/src/project-graph/plugins/internal-api.js:41:28)
      at async Promise.all (index 1)
      at processFilesAndCreateAndSerializeProjectGraph (/Users/firfi/work/typia-nx/node_modules/nx/src/daemon/server/project-graph-incremental-recomputation.js:148:43)
      at Timeout._onTimeout (/Users/firfi/work/typia-nx/node_modules/nx/src/daemon/server/project-graph-incremental-recomputation.js:85:13)



### Package Manager Version

npm 10.2.4

### Operating System

- [X] macOS
- [ ] Linux
- [ ] Windows
- [ ] Other (Please specify)

### Additional Information

_No response_

JosephAnson commented 1 week ago

Did you find a workaround for this? We're also having the issue where we've created a vite plugin as a library, it doesn't find the library correctly when imported into vite.config, the paths aren't working.

dearlordylord commented 1 week ago

I didn't. I have an impression NX doesn't support ESM modules out-of-the-box, you have to actually change all your libs to ESM for it to work

nrwl / nx