vitejs / vite-plugin-react-swc

Speed up your Vite dev server with SWC
MIT License
778 stars 50 forks source link

Conflict calling refresh-runtime.js with another plugin #90

Closed hassanzohdy closed 1 year ago

hassanzohdy commented 1 year ago

Hello,

I'm trying to use "@vitejs/plugin-react-swc" plugin but it has a conflict with another plugin that i already developed, you can check its source code here https://github.com/hassanzohdy/mongez-vite.

The issue is that the rswc plugin is trying to resolve "refresh-runtime.js" from the path of my package.

When i start the project, i receive the following error:

[vite] Internal server error: ENOENT: no such file or directory, open 'D:\xampp\htdocs\apps\mentoor\Online Store\dashboard\node_modules\@mongez\vite\esm\refresh-runtime.js'

I made some investigations with index.mjs, i tried to log the load resolver with the following code:

    {
      name: "vite:react-swc:resolve-runtime",
      apply: "serve",
      enforce: "pre",
      // Run before Vite default resolve to avoid syscalls
      resolveId: (id) => id === runtimePublicPath ? id : void 0,
      load: (id) => {
        if (_dirname.includes('@mongez')) {
          console.log('_dirname', _dirname);
          console.log('id', id);
          console.log('runtimePublicPath', runtimePublicPath);
        }
        return id === runtimePublicPath ? readFileSync(join(_dirname, "refresh-runtime.js"), "utf-8") : void 0;
      }
    },

The output of these console logs:

_dirname D:\xampp\htdocs\mentoor\apps\Online Store\dashboard\node_modules\@mongez\vite\esm
id D:/xampp/htdocs/mentoor/apps/Online Store/dashboard/src/shared/initial-config.ts
runtimePublicPath /@react-refresh
_dirname D:\xampp\htdocs\mentoor\apps\Online Store\dashboard\node_modules\@mongez\vite\esm
id D:/xampp/htdocs/mentoor/apps/Online Store/dashboard/src/shared/definitions.d.ts
runtimePublicPath /@react-refresh
_dirname D:\xampp\htdocs\mentoor\apps\Online Store\dashboard\node_modules\@mongez\vite\esm
id D:/xampp/htdocs/mentoor/apps/Online Store/dashboard/src/shared/endpoint.ts
runtimePublicPath /@react-refresh
_dirname D:\xampp\htdocs\mentoor\apps\Online Store\dashboard\node_modules\@mongez\vite\esm
id D:/xampp/htdocs/mentoor/apps/Online Store/dashboard/src/shared/flags.ts
runtimePublicPath /@react-refresh
_dirname D:\xampp\htdocs\mentoor\apps\Online Store\dashboard\node_modules\@mongez\vite\esm
id D:/xampp/htdocs/mentoor/apps/Online Store/dashboard/src/shared/router-configurations.ts
runtimePublicPath /@react-refresh
_dirname D:\xampp\htdocs\mentoor\apps\Online Store\dashboard\node_modules\@mongez\vite\esm
id D:/xampp/htdocs/mentoor/apps/Online Store/dashboard/node_modules/vite/dist/client/env.mjs
runtimePublicPath /@react-refresh
_dirname D:\xampp\htdocs\mentoor\apps\Online Store\dashboard\node_modules\@mongez\vite\esm
id vite/dynamic-import-helper
runtimePublicPath /@react-refresh

I'm not really sure why the conflict happens with my plugin, but what i can only think of, in the plugin i inject tsconfig.json path aliases to vite, maybe this what reflects on it.

Package version: 3.3.0 Vite version: 4.3.2

vite.config.ts contents:

// import react from "@vitejs/plugin-react";
import mongezVite from "@mongez/vite";
import react from "@vitejs/plugin-react-swc";
import { defineConfig } from "vite";

// https://vitejs.dev/config/
export default defineConfig(() => ({
  plugins: [mongezVite(), react()],
  envPrefix: "APP_",
}));

P.S: my plugin works fine with @vitejs/plugin-react plugin but i'm not really sure why it does not with swc plugin.

Thanks.

ArnaudBarre commented 1 year ago

Are you bundling the code of the plugin into another plugin?

hassanzohdy commented 1 year ago

@ArnaudBarre no, i'm using both plugins in a react project.

ArnaudBarre commented 1 year ago

Yeah so I will need a repro because from the error it seems that the code is not running in node_modules/@vitejs/plugin-react-swc

hassanzohdy commented 1 year ago

I generated new vite project and imported two plugins, here is the repo for this project https://github.com/hassanzohdy/vite-react-swc.

ArnaudBarre commented 1 year ago

The issue is here: https://github.com/hassanzohdy/mongez-vite/blob/63443ae2a1e8daa933b5525c13cb3e87169e76e7/src/generateHtaccess.ts#L11

You should not override a global with a specific meaning like __dirname (and set it to a static value instead of a dynamic one)