reactjs - Vite 5.0 - Hot Reload fungerar inte efter uppgradering från 4.5.0

Vi använder för närvarande Vite 5.0.0 i en React TS-miljö efter uppgradering från 4.5.0. Vi har dock vissa problem med hot reload. Efter varje ändring utför Vite en fullständig sidladdning.

Jag tror att detta händer på grund av cirkulära importer i vårt projekt: BILD HÄR

Men saken är den att, trots att det finns cirkulära importer, brukade Vite 4.5.0 utföra hot reloads utan problem.

Vad kan jag göra för att få Vite att återuppta användningen av hot reloads i fall som detta?

• Reproducerad med yarn vite --mode development

• Orsakad efter att ha sparat en fil

• Förväntade snabb omladdning men fick en fullständig sidomladdning

Vår vite.config.ts-fil:

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import viteTsconfigPaths from 'vite-tsconfig-paths';
import eslint from 'vite-plugin-eslint';
import * as path from 'path';
import { readFileSync } from 'fs';
import { read, utils } from 'xlsx';

export default defineConfig({
  // depending on your application, base can also be "/"
  appType: 'spa',
  base: '/',
  assetsInclude: ['**/*.xlsx'],
  plugins: [
    react({
      include: '**/*.tsx',
    }),
    eslint(),
    viteTsconfigPaths(),
    {
      // this plugin handles ?sheetjs tags
      name: 'vite-sheet',
      transform(code, id) {
        if (!id.match(/\?sheetjs$/)) return;
        const wb = read(readFileSync(id.replace(/\?sheetjs$/, '')));
        const data = utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);
        return `export default JSON.parse('${JSON.stringify(data)}')`;
      },
    },
  ],
  server: {
    // this ensures that the browser opens upon server start
    open: true,
    // this sets a default port to 3000
    port: 3000,
    hmr: true,
    watch: {
      usePolling: true,
    },
  },
  resolve: {
    alias: [
      {
        find: /^moment$/,
        replacement: path.resolve(__dirname, './alias.js'),
      },
      {
        find: /^gc-dv$/,
        replacement: path.resolve(
          __dirname,
          './node_modules/@grapecity/activereports/lib/node_modules/gc-dv.js'
        ),
      },
      {
        // eslint-disable-next-line no-useless-escape
        find: /^@grapecity\/ar-js-pagereport$/,
        replacement: path.resolve(
          __dirname,
          './node_modules/@grapecity/activereports/lib/node_modules/@grapecity/ar-js-pagereport.js'
        ),
      },
      {
        find: /^barcodejs$/,
        replacement: path.resolve(
          __dirname,
          './node_modules/@grapecity/activereports/lib/node_modules/barcodejs.js'
        ),
      },
    ],
  },
});

Systeminformation:

System:
    OS: macOS 14.1.1
    CPU: (10) arm64 Apple M2 Pro
    Memory: 249.61 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.4.0 - ~/.nvm/versions/node/v20.4.0/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 9.7.2 - ~/.nvm/versions/node/v20.4.0/bin/npm
    Watchman: 2023.10.09.00 - /opt/homebrew/bin/watchman
  Browsers:
    Chrome: 119.0.6045.159
    Edge: 119.0.2151.72
    Safari: 17.1
  npmPackages:
    @vitejs/plugin-react: 4.2.0 => 4.2.0 
    vite: 5.0.0 => 5.0.0