Application Error: failed to execute insertBefore on Node about vite

[Ian-inein]

This issue is from remix remixDevTools, remove it from "vite.config.ts":

import { vitePlugin as remix } from "@remix-run/dev";
import { installGlobals } from "@remix-run/node";
import { defineConfig } from "vite";
import tsconfigPaths from "vite-tsconfig-paths";

installGlobals();

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

[huijiewei]

override rollup to 4.15.0, this is rollup issue.

[dhavalveera]

override rollup to 4.15.0, this is rollup issue.

I don't have rollup in my package.json...

below is my package.json:

"dependencies": {
    "@remix-run/node": "^2.8.1",
    "@remix-run/react": "^2.8.1",
    "@remix-run/serve": "^2.8.1",
    "flowbite-react": "^0.9.0",
    "isbot": "^4.1.0",
    "preline": "^2.0.3",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-icons": "^5.0.1",
    "tailwind-merge": "^2.2.2"
  },
  "devDependencies": {
    "@remix-run/dev": "^2.8.1",
    "@types/react": "^18.2.20",
    "@types/react-dom": "^18.2.7",
    "@typescript-eslint/eslint-plugin": "^6.7.4",
    "@typescript-eslint/parser": "^6.7.4",
    "autoprefixer": "^10.4.19",
    "cssnano": "^6.1.1",
    "eslint": "^8.38.0",
    "eslint-import-resolver-typescript": "^3.6.1",
    "eslint-plugin-import": "^2.28.1",
    "eslint-plugin-jsx-a11y": "^6.7.1",
    "eslint-plugin-react": "^7.33.2",
    "eslint-plugin-react-hooks": "^4.6.0",
    "prettier": "^3.2.5",
    "prettier-plugin-tailwindcss": "^0.5.12",
    "remix-development-tools": "^4.1.4",
    "tailwindcss": "^3.4.1",
    "typescript": "^5.1.6",
    "vite": "^5.1.0",
    "vite-tsconfig-paths": "^4.2.1"
  },
  "engines": {
    "node": ">=18.0.0"
  }

[huijiewei]

https://docs.npmjs.com/cli/v10/configuring-npm/package-json#overrides

[dhavalveera]

{
  "overrides": {
    "vite": {
      "rollup": "4.15.0"
    }
  }
}

@huijiewei it's need to be this way?

[huijiewei]

https://docs.npmjs.com/cli/v10/configuring-npm/package-json#overrides

[dhavalveera]

https://docs.npmjs.com/cli/v10/configuring-npm/package-json#overrides

Sir I saw that, based on that I am asking, it should be as below?

{
  "overrides": {
    "vite": {
      "rollup": "4.15.0"
    }
  }
}

because this is something I am doing first time

[huijiewei]

try ‘’’{
"overrides": {
"rollup": "4.15.0"
}
}’’’

[dhavalveera]

try ‘’’{ "overrides": { "rollup": "4.15.0" } }’’’

still I am encountering the same issue as shown /shared in the Video as I am using Remix with Vite, and this is happening during I am running npm run dev

[dhavalveera]

even though, right after this I upgraded the vite as well, but the issue is still persistant

[github-actions]

Hello @dhavalveera. Please provide a minimal reproduction using a GitHub repository or StackBlitz. Issues marked with needs reproduction will be closed if they have no activity within 3 days.

[dhavalveera]

@sapphi-red - how to provide a minimal reproduction using a GitHub repository?

[sapphi-red]

Please read the linked article and then upload that code to GitHub.

[dhavalveera]

Please read the linked article and then upload that code to GitHub.

I've already the code on GitHub, but it's a Private Repo I've currently and in that I've another branch. @sapphi-red

[sapphi-red]

If you already made a minimal reproduction, then I think you can make a new public repository and put it in the new repository.

[dhavalveera]

If you already made a minimal reproduction, then I think you can make a new public repository and put it in the new repository.

https://github.com/dhavalveera/mediateck-remix

here is the Repository.

I am getting error in such like, go to About Us Page, wait for 2 seconds, modify something in the code, save and the HMR will happen and then go to top and click on home page and it will crash for me as I've shown in the above shared video.

[sapphi-red]

Please make a minimal reproduction.

[dhavalveera]

Please make a minimal reproduction.

I don't have & I don't know from where the issue is occuring, that's why I shared entire repo @sapphi-red

[sapphi-red]

Please read the linked article. It describes how you can trim down the code.

[dhavalveera]

This issue is from remix remixDevTools, remove it from "vite.config.ts":

import { vitePlugin as remix } from "@remix-run/dev";
import { installGlobals } from "@remix-run/node";
import { defineConfig } from "vite";
import tsconfigPaths from "vite-tsconfig-paths";

installGlobals();

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

I guess I tried that as well, but it was failing for me, but I'll look again.

[Ian-inein]

This issue is from remix remixDevTools, remove it from "vite.config.ts":

import { vitePlugin as remix } from "@remix-run/dev";
import { installGlobals } from "@remix-run/node";
import { defineConfig } from "vite";
import tsconfigPaths from "vite-tsconfig-paths";

installGlobals();

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

I guess I tried that as well, but it was failing for me, but I'll look again.

Make public your repository, to see whats happening

[dhavalveera]

This issue is from remix remixDevTools, remove it from "vite.config.ts":

import { vitePlugin as remix } from "@remix-run/dev";
import { installGlobals } from "@remix-run/node";
import { defineConfig } from "vite";
import tsconfigPaths from "vite-tsconfig-paths";

installGlobals();

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

I guess I tried that as well, but it was failing for me, but I'll look again.

Make public your repository, to see whats happening

https://github.com/dhavalveerarediff/dv-temp-repo

here it is @Ian-inein

[dhavalveera]

@Ian-inein --- have you checked the repository?