javascript - Vite builder radi lokalno, ali se ruši u produkciji

Moja vite konfiguracija:

import react from '@vitejs/plugin-react';
import { defineConfig } from 'vite';
import svgr from 'vite-plugin-svgr';
import tsconfigPaths from 'vite-tsconfig-paths';

export default defineConfig({
  plugins: [tsconfigPaths(), svgr(), react()],
  server: {
    port: 3000,
  },
  preview: {
    port: 3000,
  },
  resolve: {
    alias: {
      // This is needed for builds
      './runtimeConfig': './runtimeConfig.browser',
    },
  },
  build: {
    outDir: 'build',
    sourcemap: true,
    commonjsOptions: {
      include: [],
    },
  },
  optimizeDeps: {
    disabled: false,
  },
});

Moji build skripti:

NODE_ENV=test env-cmd -f ./config/.env.test node --max_old_space_size=16384 ./node_modules/vite/bin/vite.js build

Ako gradim lokalno, aplikacija radi. Ako gradim i implementiram u AWS koristeći istu naredbu, dobivam ovu grešku: TypeError: ee.current je null

što nakon preskakanja kroz datoteke i dijelove dovodi me ovdje:

exports.useContext = function(a) {
  return U.current.useContext(a);
};

(Vjerujem da je ovo unutrašnjost Reacta)

To se nalazi u mapi pod nazivom: /node_modules/.vite/deps_build-build/chunk-HBFDPAXM.js?v=a0616ab2.

Znam da ovo nije puno informacija, ali krećem se ovdje u mraku. Nemam pojma zašto se ponaša na ovaj način. Gotovo je kao da AWS ne razumije dijelove?

Cijela pogreška:

TypeError: ee.current is null
    useContext chunk-HBFDPAXM.js:258
    vWe chunk-FG2S2VZJ.js:38
    F8 chunk-OVR575D5.js:2971
    Bxr SwitchThemeButton.tsx:11
    z3 chunk-DTP5RXYY.js:4050
    Ws chunk-DTP5RXYY.js:7186
    Gs chunk-DTP5RXYY.js:6853
    $3 chunk-DTP5RXYY.js:6846
    Um chunk-DTP5RXYY.js:6829
    vv chunk-DTP5RXYY.js:6545
    n7 chunk-DTP5RXYY.js:6606
    He chunk-DTP5RXYY.js:3179
    fo chunk-DTP5RXYY.js:6417
    fo chunk-DTP5RXYY.js:6416
    $s chunk-DTP5RXYY.js:6405
    K8 chunk-DTP5RXYY.js:4362
    call react-router-dom.js:532
    call react-router-dom.js:531
    S react-router-dom.js:136
    C react-router-dom.js:154
    I4 react-router-dom.js:943
    xei react-router-dom.js:1386
    v react-router-dom.js:1316
    vt chunk-DTP5RXYY.js:1500
    Ar chunk-DTP5RXYY.js:1516
    Ur chunk-DTP5RXYY.js:1519
    Rd chunk-DTP5RXYY.js:2612
    C3 chunk-DTP5RXYY.js:2639
    Hp chunk-DTP5RXYY.js:2942
    yv chunk-DTP5RXYY.js:6622
    nt chunk-DTP5RXYY.js:1445
    Hp chunk-DTP5RXYY.js:2720
    N1 chunk-DTP5RXYY.js:2010
    Vi chunk-DTP5RXYY.js:1992
    q4 chunk-DTP5RXYY.js:2683
    nc chunk-DTP5RXYY.js:2656
    Yu chunk-DTP5RXYY.js:2663
    Yu chunk-DTP5RXYY.js:2662
    createRoot chunk-DTP5RXYY.js:7813
    <anonymous> index.tsx:11
react_devtools_backend.js:4026:25
    overrideMethod react_devtools_backend.js:4026
    Fd chunk-DTP5RXYY.js:4518
    callback chunk-DTP5RXYY.js:4533
    gu chunk-DTP5RXYY.js:3565
    t6 chunk-DTP5RXYY.js:6215
    Op chunk-DTP5RXYY.js:6175
    d5 chunk-DTP5RXYY.js:6152
    a6 chunk-DTP5RXYY.js:6939
    s0 chunk-DTP5RXYY.js:6895
    n7 chunk-DTP5RXYY.js:6614
    He chunk-DTP5RXYY.js:3179
    fo chunk-DTP5RXYY.js:6417
    (Async: VoidFunction)
    fo chunk-DTP5RXYY.js:6416
    $s chunk-DTP5RXYY.js:6405
    K8 chunk-DTP5RXYY.js:4362
    call react-router-dom.js:532
    call react-router-dom.js:531
    S react-router-dom.js:136
    C react-router-dom.js:154
    I4 react-router-dom.js:943
    xei react-router-dom.js:1386
    v react-router-dom.js:1316
    vt chunk-DTP5RXYY.js:1500
    Ar chunk-DTP5RXYY.js:1516
    Ur chunk-DTP5RXYY.js:1519
    Rd chunk-DTP5RXYY.js:2612
    C3 chunk-DTP5RXYY.js:2639
    Hp chunk-DTP5RXYY.js:2942
    yv chunk-DTP5RXYY.js:6622
    nt chunk-DTP5RXYY.js:1445
    Hp chunk-DTP5RXYY.js:2720
    N1 chunk-DTP5RXYY.js:2010
    Vi chunk-DTP5RXYY.js:1992
    q4 chunk-DTP5RXYY.js:2683
    nc chunk-DTP5RXYY.js:2656
    Yu chunk-DTP5RXYY.js:2663
    Yu chunk-DTP5RXYY.js:2662
    createRoot chunk-DTP5RXYY.js:7813
    <anonymous> index.tsx:11

Evo SwitchThemeButton (3. datoteka):

export function SwitchThemeButton() {
  const classes = useStyles();
  const { setCurrentTheme, currentThemeKey: currentTheme } = useContext(ThemeContext);

  const isDarkMode = currentTheme === 'dark';
  const switchTheme = useCallback(() => {
    setCurrentTheme(isDarkMode ? 'light' : 'dark');
  }, [isDarkMode, setCurrentTheme]);

  const nextTheme = isDarkMode ? 'light' : 'dark';
  return (
    <Tooltip
      sx={{ '&:hover': { background: 'none' }, '&:focus': { outline: 'none' } }}
      title={`Switch to ${nextTheme} mode`}
    >
      <IconButton onClick={switchTheme}>
        {
          isDarkMode ? <LightModeIcon className={classes.iconBtn} /> : <DarkModeIcon className={classes.iconBtn} />
        }
      </IconButton>
    </Tooltip>
  );
}

Moja nginx datoteka:

server {
     listen       80;
     server_name  localhost;
 
     location / {
         root   /usr/share/nginx/html;
         index  index.html index.htm;
         try_files $uri /index.html;                 
     }
 
     error_page   500 502 503 504  /50x.html;
     location = /50x.html {
         root   /usr/share/nginx/html;
     }
 }

Ovo radi lokalno i radi kada koristim react-scripts za izgradnju.

Ako nitko nema odgovor, čak i najmanja ideja bi bila cijenjena