vitejs / vite

Next generation frontend tooling. It's fast!
http://vite.dev
MIT License
68.97k stars 6.24k forks source link

Within a dev container using Docker 26, `vite dev` or `vite preview` cannot be accessed from the host #16522

Open sharky98 opened 7 months ago

sharky98 commented 7 months ago

Describe the bug

I initialy though this was a case of https://github.com/vitejs/vite/issues/11468#issuecomment-2073871487, but it seems it is something else, so I am opening another issue.

Using Dev Containers for development, and after upgrading to Docker 26 (from 25) on the host, I am unable to connect to either vite dev or vite preview server using the default and basic port forwarding feature of the dev containers.

By "unable to connect", I mean that the server is launched, however when trying to connect from my host using http://localhost:4200/, either Chromium or Firefox Dev Edition request hangs indefinitely on loading (it stays in loading state without timing out for at least for a good 5-10 minutes; didn't test longer than that).

I am using Nx, but using vite directly does not change the outcome. For the recoard, I also have a dotnet server that is responding as expected to the request, so for now (in my limited available code base), this point out to vite, but it may well be due to whichever node server backend vite is using.

Reproduction

unable to provide without control of the host docker version

Steps to reproduce

No response

System Info

Dev Container

I am using a custom pre-built image, which is a copy of mcr.microsoft.com/devcontainers/typescript-node:20

  System:
    OS: Linux 6.5 Ubuntu 22.04.4 LTS 22.04.4 LTS (Jammy Jellyfish)
    CPU: (16) x64 Intel(R) Core(TM) i7-10700 CPU @ 2.90GHz
    Memory: 26.03 GB / 31.12 GB
    Container: Yes
    Shell: 5.1.16 - /bin/bash
  Binaries:
    Node: 20.12.2 - /usr/local/share/nvm/versions/node/v20.12.2/bin/node
    Yarn: 1.22.19 - /usr/bin/yarn
    npm: 10.5.0 - /usr/local/share/nvm/versions/node/v20.12.2/bin/npm
    pnpm: 9.0.1 - /usr/local/share/nvm/versions/node/v20.12.2/bin/pnpm
  npmPackages:
    @vitejs/plugin-react: 4.2.1 => 4.2.1 
    @vitejs/plugin-react-swc: 3.6.0 => 3.6.0 
    vite: 5.2.8 => 5.2.8

Host

  System:
    OS: Linux 6.5 Ubuntu 22.04.4 LTS 22.04.4 LTS (Jammy Jellyfish)
    CPU: (16) x64 Intel(R) Core(TM) i7-10700 CPU @ 2.90GHz
    Memory: 24.96 GB / 31.12 GB
    Container: Yes
    Shell: 5.1.16 - /bin/bash
  Binaries:
    Node: 20.11.1 - ~/.nvm/versions/node/v20.11.1/bin/node
    npm: 10.5.0 - ~/.nvm/versions/node/v20.11.1/bin/npm
    pnpm: 8.15.5 - ~/.nvm/versions/node/v20.11.1/bin/pnpm
  Browsers:
    Chromium: 124.0.6367.60

Used Package Manager

pnpm

Logs

Click to expand! ```shell vite:config bundled config file loaded in 107.76ms +0ms vite:config using resolved config: { vite:config root: '/workspaces/[project]/apps/[project-name]/frontend', vite:config cacheDir: '/workspaces/[project]/node_modules/.vite/apps/frontend', vite:config server: { vite:config preTransformRequests: true, vite:config port: 4200, vite:config host: 'localhost', vite:config sourcemapIgnoreList: [Function: isInNodeModules$1], vite:config middlewareMode: false, vite:config fs: { vite:config strict: true, vite:config allow: [Array], vite:config deny: [Array], vite:config cachedChecks: undefined vite:config } vite:config }, vite:config preview: { vite:config port: 4300, vite:config strictPort: undefined, vite:config host: 'localhost', vite:config https: undefined, vite:config open: undefined, vite:config proxy: undefined, vite:config cors: undefined, vite:config headers: undefined vite:config }, vite:config plugins: [ vite:config 'vite:optimized-deps', vite:config 'vite:watch-package-data', vite:config 'vite:pre-alias', vite:config 'alias', vite:config 'vite:react-swc:resolve-runtime', vite:config 'vite:modulepreload-polyfill', vite:config 'vite:resolve', vite:config 'vite:html-inline-proxy', vite:config 'vite:css', vite:config 'vite:json', vite:config 'vite:wasm-helper', vite:config 'vite:worker', vite:config 'vite:asset', vite:config 'vite:react-swc', vite:config 'nx-vite-ts-paths', vite:config 'vite:wasm-fallback', vite:config 'vite:define', vite:config 'vite:css-post', vite:config 'vite:worker-import-meta-url', vite:config 'vite:asset-import-meta-url', vite:config 'vite:dynamic-import-vars', vite:config 'vite:import-glob', vite:config 'vite:client-inject', vite:config 'vite:css-analysis', vite:config 'vite:import-analysis' vite:config ], vite:config build: { vite:config target: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ], vite:config cssTarget: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ], vite:config outDir: '../../../dist/apps/frontend', vite:config assetsDir: 'assets', vite:config assetsInlineLimit: 4096, vite:config cssCodeSplit: true, vite:config sourcemap: false, vite:config rollupOptions: {}, vite:config minify: 'esbuild', vite:config terserOptions: {}, vite:config write: true, vite:config emptyOutDir: true, vite:config copyPublicDir: true, vite:config manifest: false, vite:config lib: false, vite:config ssr: false, vite:config ssrManifest: false, vite:config ssrEmitAssets: false, vite:config reportCompressedSize: true, vite:config chunkSizeWarningLimit: 500, vite:config watch: null, vite:config commonjsOptions: { vite:config include: [Array], vite:config extensions: [Array], vite:config transformMixedEsModules: true vite:config }, vite:config dynamicImportVarsOptions: { warnOnError: true, exclude: [Array] }, vite:config modulePreload: { polyfill: true }, vite:config cssMinify: true vite:config }, vite:config test: { vite:config globals: true, vite:config cache: { dir: '../../../node_modules/.vitest' }, vite:config environment: 'jsdom', vite:config include: [ 'src/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}' ], vite:config reporters: [ 'default' ], vite:config coverage: { vite:config reportsDirectory: '../../../coverage/apps/frontend', vite:config provider: 'v8' vite:config } vite:config }, vite:config configFile: '/workspaces/[project]/apps/[project-name]/frontend/vite.config.ts', vite:config optimizeDeps: { vite:config holdUntilCrawlEnd: true, vite:config force: undefined, vite:config include: [ 'react/jsx-dev-runtime' ], vite:config esbuildOptions: { preserveSymlinks: false, jsx: 'automatic' } vite:config }, vite:config esbuild: false, vite:config configFileDependencies: [ '/workspaces/[project]/apps/[project-name]/frontend/vite.config.ts' ], vite:config inlineConfig: { vite:config root: undefined, vite:config base: undefined, vite:config mode: undefined, vite:config configFile: 'apps/[project-name]/frontend/vite.config.ts', vite:config logLevel: undefined, vite:config clearScreen: undefined, vite:config optimizeDeps: { force: undefined }, vite:config server: { host: undefined } vite:config }, vite:config base: '/', vite:config rawBase: '/', vite:config resolve: { vite:config mainFields: [ 'browser', 'module', 'jsnext:main', 'jsnext' ], vite:config conditions: [], vite:config extensions: [ vite:config '.mjs', '.js', vite:config '.mts', '.ts', vite:config '.jsx', '.tsx', vite:config '.json' vite:config ], vite:config dedupe: [], vite:config preserveSymlinks: false, vite:config alias: [ [Object], [Object] ] vite:config }, vite:config publicDir: '/workspaces/[project]/apps/[project-name]/frontend/public', vite:config command: 'serve', vite:config mode: 'development', vite:config ssr: { vite:config target: 'node', vite:config optimizeDeps: { noDiscovery: true, esbuildOptions: [Object] } vite:config }, vite:config isWorker: false, vite:config mainConfig: null, vite:config bundleChain: [], vite:config isProduction: false, vite:config css: { lightningcss: undefined }, vite:config envDir: '/workspaces/[project]/apps/[project-name]/frontend', vite:config env: { BASE_URL: '/', MODE: 'development', DEV: true, PROD: false }, vite:config assetsInclude: [Function: assetsInclude], vite:config logger: { vite:config hasWarned: false, vite:config info: [Function: info], vite:config warn: [Function: warn], vite:config warnOnce: [Function: warnOnce], vite:config error: [Function: error], vite:config clearScreen: [Function: clearScreen], vite:config hasErrorLogged: [Function: hasErrorLogged] vite:config }, vite:config packageCache: Map(4) { vite:config 'fnpd_/workspaces/[project]' => { vite:config dir: '/workspaces/[project]', vite:config data: [Object], vite:config hasSideEffects: [Function: hasSideEffects], vite:config webResolvedImports: {}, vite:config nodeResolvedImports: {}, vite:config setResolvedCache: [Function: setResolvedCache], vite:config getResolvedCache: [Function: getResolvedCache] vite:config }, vite:config 'fnpd_/workspaces/[project]/apps/[project-name]/frontend' => { vite:config dir: '/workspaces/[project]', vite:config data: [Object], vite:config hasSideEffects: [Function: hasSideEffects], vite:config webResolvedImports: {}, vite:config nodeResolvedImports: {}, vite:config setResolvedCache: [Function: setResolvedCache], vite:config getResolvedCache: [Function: getResolvedCache] vite:config }, vite:config 'fnpd_/workspaces/[project]/apps/[project-name]' => { vite:config dir: '/workspaces/[project]', vite:config data: [Object], vite:config hasSideEffects: [Function: hasSideEffects], vite:config webResolvedImports: {}, vite:config nodeResolvedImports: {}, vite:config setResolvedCache: [Function: setResolvedCache], vite:config getResolvedCache: [Function: getResolvedCache] vite:config }, vite:config 'fnpd_/workspaces/[project]/apps' => { vite:config dir: '/workspaces/[project]', vite:config data: [Object], vite:config hasSideEffects: [Function: hasSideEffects], vite:config webResolvedImports: {}, vite:config nodeResolvedImports: {}, vite:config setResolvedCache: [Function: setResolvedCache], vite:config getResolvedCache: [Function: getResolvedCache] vite:config }, vite:config set: [Function (anonymous)] vite:config }, vite:config createResolver: [Function: createResolver], vite:config worker: { format: 'iife', plugins: '() => plugins', rollupOptions: {} }, vite:config appType: 'spa', vite:config experimental: { importGlobRestoreExtension: false, hmrPartialAccept: false }, vite:config getSortedPlugins: [Function: getSortedPlugins], vite:config getSortedPluginHooks: [Function: getSortedPluginHooks] vite:config } +7ms vite:deps removing old cache dir /workspaces/[project]/node_modules/.vite/apps/frontend/deps +0ms vite:resolve 1.40ms react/jsx-dev-runtime -> /workspaces/[project]/node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-dev-runtime.js +0ms vite:deps scanning for dependencies... +0ms VITE v5.2.8 ready in 227 ms ➜ Local: http://localhost:4200/ ➜ press h + enter to show help vite:deps Crawling dependencies using entries: vite:deps /workspaces/[project]/apps/[project-name]/frontend/index.html +0ms vite:resolve 0.14ms /src/main.tsx -> /workspaces/[project]/apps/[project-name]/frontend/src/main.tsx +0ms vite:resolve 0.59ms react -> /workspaces/[project]/node_modules/.pnpm/react@18.2.0/node_modules/react/index.js +1ms vite:resolve 0.31ms react-dom/client -> /workspaces/[project]/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/client.js +1ms vite:resolve 0.21ms ./app/app.js -> /workspaces/[project]/apps/[project-name]/frontend/src/app/app.tsx +0ms vite:resolve 0.12ms react/jsx-runtime -> /workspaces/[project]/node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js +1ms vite:resolve 0.29ms @refinedev/core -> /workspaces/[project]/node_modules/.pnpm/@refinedev+core@4.49.0_@tanstack+react-query@4.36.1_react-dom@18.2.0_react@18.2.0__react@18.2_6pxxytl5k5ch475savoid6giru/node_modules/@refinedev/core/dist/index.mjs +1ms vite:resolve 0.24ms @refinedev/react-router-v6 -> /workspaces/[project]/node_modules/.pnpm/@refinedev+react-router-v6@4.5.7_@refinedev+core@4.49.0_@tanstack+react-query@4.36.1_react-do_6iphdtncvs4c4jzbmmulo3nodi/node_modules/@refinedev/react-router-v6/dist/index.mjs +0ms vite:resolve 0.26ms react-router-dom -> /workspaces/[project]/node_modules/.pnpm/react-router-dom@6.22.3_react-dom@18.2.0_react@18.2.0__react@18.2.0/node_modules/react-router-dom/dist/index.js +1ms vite:resolve 0.69ms @my-scope/utility.app-framework -> /workspaces/[project]/libs/shared/utility/app-framework/src/index.ts +1ms vite:resolve 0.30ms @my-scope/ui.language-toggler -> /workspaces/[project]/libs/shared/ui/language-toggler/src/index.ts +0ms vite:resolve 0.20ms @my-scope/ui.layout-framework -> /workspaces/[project]/libs/shared/ui/layout-framework/src/index.ts +0ms vite:resolve 0.15ms @my-scope/ui.theme-toggler -> /workspaces/[project]/libs/shared/ui/theme-toggler/src/index.ts +1ms vite:resolve 0.15ms ./demo-pages.js -> /workspaces/[project]/apps/[project-name]/frontend/src/app/demo-pages.tsx +0ms vite:resolve 0.08ms ./nav-links.js -> /workspaces/[project]/apps/[project-name]/frontend/src/app/nav-links.tsx +0ms vite:resolve 0.07ms ./refine-data-provider-demo-pages.js -> /workspaces/[project]/apps/[project-name]/frontend/src/app/refine-data-provider-demo-pages.tsx +1ms vite:resolve 0.10ms ./tailwind-demo.js -> /workspaces/[project]/apps/[project-name]/frontend/src/app/tailwind-demo.tsx +0ms vite:resolve 0.42ms ./lib/app-framework.js -> /workspaces/[project]/libs/shared/utility/app-framework/src/lib/app-framework.tsx +2ms vite:resolve 0.43ms ./theme-toggler.js -> /workspaces/[project]/libs/shared/ui/theme-toggler/src/theme-toggler.tsx +0ms vite:resolve 0.54ms ./lib/layout/layout-framework.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/layout/layout-framework.tsx +0ms vite:resolve 0.53ms ./language-toggler.js -> /workspaces/[project]/libs/shared/ui/language-toggler/src/language-toggler.tsx +0ms vite:resolve 0.71ms @my-scope/ui.common-components -> /workspaces/[project]/libs/shared/ui/common-components/src/index.ts +1ms vite:resolve 0.16ms ./lib/sidebar/use-sidebar.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/sidebar/use-sidebar.ts +0ms vite:resolve 0.21ms @my-scope/utility.i18n-provider -> /workspaces/[project]/libs/shared/utility/i18n-provider/src/index.ts +0ms vite:resolve 0.68ms clsx -> /workspaces/[project]/node_modules/.pnpm/clsx@2.1.0/node_modules/clsx/dist/clsx.mjs +3ms vite:resolve 0.66ms @refinedev/simple-rest -> /workspaces/[project]/node_modules/.pnpm/@refinedev+simple-rest@5.0.4_@refinedev+core@4.49.0_@tanstack+react-query@4.36.1_react-dom@18_c54xwoen2nedooby5kmv3stjx4/node_modules/@refinedev/simple-rest/dist/index.mjs +0ms vite:resolve 0.41ms ../layout/layout-context.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/layout/layout-context.ts +0ms vite:resolve 0.41ms ../content/content.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/content/content.tsx +0ms vite:resolve 0.50ms @my-scope/utility.theme-framework -> /workspaces/[project]/libs/shared/utility/theme-framework/src/index.ts +1ms vite:resolve 0.60ms ./button/button.js -> /workspaces/[project]/libs/shared/ui/common-components/src/button/button.tsx +0ms vite:resolve 0.60ms react-i18next -> /workspaces/[project]/node_modules/.pnpm/react-i18next@14.1.0_i18next@23.11.1_react-dom@18.2.0_react@18.2.0__react@18.2.0/node_modules/react-i18next/dist/es/index.js +0ms vite:resolve 0.60ms ../footer/footer.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/footer/footer.tsx +0ms vite:resolve 0.53ms ./i18n.js -> /workspaces/[project]/libs/shared/utility/i18n-provider/src/i18n.ts +1ms vite:resolve 0.53ms ./links/link-button.js -> /workspaces/[project]/libs/shared/ui/common-components/src/links/link-button.tsx +0ms vite:resolve 0.52ms ../header/header.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/header/header.tsx +0ms vite:resolve 0.32ms ./register-locales.js -> /workspaces/[project]/libs/shared/utility/i18n-provider/src/register-locales.ts +1ms vite:resolve 0.32ms ./links/nav-link-button.js -> /workspaces/[project]/libs/shared/ui/common-components/src/links/nav-link-button.tsx +0ms vite:resolve 0.32ms ../navbar/navbar.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/navbar/navbar.tsx +0ms vite:resolve 0.33ms ../sidebar/sidebar.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/sidebar/sidebar.tsx +1ms vite:resolve 0.39ms @my-scope/utility.auth-provider -> /workspaces/[project]/libs/shared/utility/auth-provider/src/index.ts +0ms vite:resolve 0.41ms ./layout-provider.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/layout/layout-provider.tsx +0ms vite:resolve 0.39ms ./theme-provider.js -> /workspaces/[project]/libs/shared/utility/theme-framework/src/theme-provider.tsx +0ms vite:resolve 0.21ms ./layout-state.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/layout/layout-state.ts +1ms vite:resolve 0.37ms i18next -> /workspaces/[project]/node_modules/.pnpm/i18next@23.11.1/node_modules/i18next/dist/esm/i18next.js +1ms vite:resolve 0.66ms ./button-variants.js -> /workspaces/[project]/libs/shared/ui/common-components/src/button/button-variants.ts +1ms vite:resolve 0.64ms i18next-browser-languagedetector -> /workspaces/[project]/node_modules/.pnpm/i18next-browser-languagedetector@7.2.1/node_modules/i18next-browser-languagedetector/dist/esm/i18nextBrowserLanguageDetector.js +0ms vite:resolve 0.64ms ./layout-context.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/layout/layout-context.ts +0ms vite:resolve 0.61ms ./lib/auth-provider.js -> /workspaces/[project]/libs/shared/utility/auth-provider/src/lib/auth-provider.ts +0ms vite:resolve 0.44ms ../navbar/navbar-state.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/navbar/navbar-state.ts +1ms vite:resolve 0.38ms ../navbar/use-navbar-provider-state.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/navbar/use-navbar-provider-state.ts +0ms vite:resolve 0.39ms ./lib/auth-backend.dummy.js -> /workspaces/[project]/libs/shared/utility/auth-provider/src/lib/auth-backend.dummy.ts +0ms vite:resolve 0.35ms ../navbar/use-navbar.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/navbar/use-navbar.ts +1ms vite:resolve 0.33ms ./link-button.js -> /workspaces/[project]/libs/shared/ui/common-components/src/links/link-button.tsx +0ms vite:resolve 0.33ms ../button/button.js -> /workspaces/[project]/libs/shared/ui/common-components/src/button/button.tsx +0ms vite:resolve 0.43ms ./lib/auth-backend.js -> /workspaces/[project]/libs/shared/utility/auth-provider/src/lib/auth-backend.ts +0ms vite:resolve 0.44ms ../sidebar/use-sidebar-provider-state.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/sidebar/use-sidebar-provider-state.ts +0ms vite:resolve 0.44ms ../sidebar/sidebar-state.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/sidebar/sidebar-state.ts +0ms vite:resolve 0.41ms ./main-nav.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/header/main-nav.tsx +0ms vite:resolve 0.39ms ./use-sidebar.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/sidebar/use-sidebar.ts +0ms vite:resolve 0.21ms ./search.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/header/search.tsx +1ms vite:resolve 0.22ms ./navbar-section.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/navbar/navbar-section.tsx +0ms vite:resolve 0.12ms ./team-switcher.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/header/team-switcher.tsx +0ms vite:resolve 0.12ms ./use-navbar.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/navbar/use-navbar.ts +1ms vite:resolve 0.11ms ./user-nav.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/header/user-nav.tsx +0ms vite:resolve 0.55ms tailwind-variants -> /workspaces/[project]/node_modules/.pnpm/tailwind-variants@0.2.1_tailwindcss@3.4.3_ts-node@10.9.1_@swc+core@1.4.13_@swc+helpers@0.5.9__giqdzdxzfxz42nlzepa4eepznm/node_modules/tailwind-variants/dist/index.js +1ms vite:resolve 0.56ms http-status-codes -> /workspaces/[project]/node_modules/.pnpm/http-status-codes@2.3.0/node_modules/http-status-codes/build/es/index.js +0ms vite:resolve 0.13ms ./navbar-state.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/navbar/navbar-state.ts +1ms vite:resolve 0.13ms ./sidebar-state.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/sidebar/sidebar-state.ts +0ms vite:resolve 0.19ms ./navbar-link.js -> /workspaces/[project]/libs/shared/ui/layout-framework/src/lib/navbar/navbar-link.tsx +1ms vite:deps Scan completed in 214.83ms: vite:deps @refinedev/core -> /workspaces/[project]/node_modules/.pnpm/@refinedev+core@4.49.0_@tanstack+react-query@4.36.1_react-dom@18.2.0_react@18.2.0__react@18.2_6pxxytl5k5ch475savoid6giru/node_modules/@refinedev/core/dist/index.mjs vite:deps @refinedev/react-router-v6 -> /workspaces/[project]/node_modules/.pnpm/@refinedev+react-router-v6@4.5.7_@refinedev+core@4.49.0_@tanstack+react-query@4.36.1_react-do_6iphdtncvs4c4jzbmmulo3nodi/node_modules/@refinedev/react-router-v6/dist/index.mjs vite:deps @refinedev/simple-rest -> /workspaces/[project]/node_modules/.pnpm/@refinedev+simple-rest@5.0.4_@refinedev+core@4.49.0_@tanstack+react-query@4.36.1_react-dom@18_c54xwoen2nedooby5kmv3stjx4/node_modules/@refinedev/simple-rest/dist/index.mjs vite:deps clsx -> /workspaces/[project]/node_modules/.pnpm/clsx@2.1.0/node_modules/clsx/dist/clsx.mjs vite:deps http-status-codes -> /workspaces/[project]/node_modules/.pnpm/http-status-codes@2.3.0/node_modules/http-status-codes/build/es/index.js vite:deps i18next -> /workspaces/[project]/node_modules/.pnpm/i18next@23.11.1/node_modules/i18next/dist/esm/i18next.js vite:deps i18next-browser-languagedetector -> /workspaces/[project]/node_modules/.pnpm/i18next-browser-languagedetector@7.2.1/node_modules/i18next-browser-languagedetector/dist/esm/i18nextBrowserLanguageDetector.js vite:deps react -> /workspaces/[project]/node_modules/.pnpm/react@18.2.0/node_modules/react/index.js vite:deps react-dom/client -> /workspaces/[project]/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/client.js vite:deps react-i18next -> /workspaces/[project]/node_modules/.pnpm/react-i18next@14.1.0_i18next@23.11.1_react-dom@18.2.0_react@18.2.0__react@18.2.0/node_modules/react-i18next/dist/es/index.js vite:deps react-router-dom -> /workspaces/[project]/node_modules/.pnpm/react-router-dom@6.22.3_react-dom@18.2.0_react@18.2.0__react@18.2.0/node_modules/react-router-dom/dist/index.js vite:deps react/jsx-runtime -> /workspaces/[project]/node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js vite:deps tailwind-variants -> /workspaces/[project]/node_modules/.pnpm/tailwind-variants@0.2.1_tailwindcss@3.4.3_ts-node@10.9.1_@swc+core@1.4.13_@swc+helpers@0.5.9__giqdzdxzfxz42nlzepa4eepznm/node_modules/tailwind-variants/dist/index.js +202ms vite:deps creating package.json in /workspaces/[project]/node_modules/.vite/apps/frontend/deps_temp_66cdbcff +224ms vite:resolve 0.47ms react-dom -> /workspaces/[project]/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/index.js +0ms vite:resolve 0.29ms query-string -> /workspaces/[project]/node_modules/.pnpm/query-string@7.1.3/node_modules/query-string/index.js +0ms vite:resolve 0.72ms react -> /workspaces/[project]/node_modules/.pnpm/react@18.2.0/node_modules/react/index.js +1ms vite:resolve 0.76ms @babel/runtime/helpers/esm/classCallCheck -> /workspaces/[project]/node_modules/.pnpm/@babel+runtime@7.24.4/node_modules/@babel/runtime/helpers/esm/classCallCheck.js +0ms vite:resolve 0.56ms axios -> /workspaces/[project]/node_modules/.pnpm/axios@1.6.8/node_modules/axios/index.js +1ms vite:resolve 0.35ms @refinedev/core -> /workspaces/[project]/node_modules/.pnpm/@refinedev+core@4.49.0_@tanstack+react-query@4.36.1_react-dom@18.2.0_react@18.2.0__react@18.2_6pxxytl5k5ch475savoid6giru/node_modules/@refinedev/core/dist/index.mjs +0ms vite:resolve 0.37ms @babel/runtime/helpers/esm/createClass -> /workspaces/[project]/node_modules/.pnpm/@babel+runtime@7.24.4/node_modules/@babel/runtime/helpers/esm/createClass.js +0ms vite:resolve 0.84ms qs -> /workspaces/[project]/node_modules/.pnpm/qs@6.12.1/node_modules/qs/lib/index.js +3ms vite:resolve 0.86ms tailwind-merge -> /workspaces/[project]/node_modules/.pnpm/tailwind-merge@2.3.0/node_modules/tailwind-merge/dist/bundle-mjs.mjs +0ms vite:resolve 1.20ms react -> /workspaces/[project]/node_modules/.pnpm/react@18.2.0/node_modules/react/index.js +8ms vite:resolve 1.22ms strict-uri-encode -> /workspaces/[project]/node_modules/.pnpm/strict-uri-encode@2.0.0/node_modules/strict-uri-encode/index.js +0ms vite:resolve 1.24ms react-router-dom -> /workspaces/[project]/node_modules/.pnpm/react-router-dom@6.22.3_react-dom@18.2.0_react@18.2.0__react@18.2.0/node_modules/react-router-dom/dist/index.js +2ms vite:resolve 0.30ms react-dom -> /workspaces/[project]/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/index.js +0ms vite:resolve 0.53ms decode-uri-component -> /workspaces/[project]/node_modules/.pnpm/decode-uri-component@0.2.2/node_modules/decode-uri-component/index.js +1ms vite:resolve 0.44ms react-router -> /workspaces/[project]/node_modules/.pnpm/react-router@6.22.3_react@18.2.0/node_modules/react-router/dist/index.js +2ms vite:resolve 0.47ms split-on-first -> /workspaces/[project]/node_modules/.pnpm/split-on-first@1.1.0/node_modules/split-on-first/index.js +1ms vite:resolve 0.43ms filter-obj -> /workspaces/[project]/node_modules/.pnpm/filter-obj@1.1.0/node_modules/filter-obj/index.js +1ms vite:resolve 0.37ms @remix-run/router -> /workspaces/[project]/node_modules/.pnpm/@remix-run+router@1.15.3/node_modules/@remix-run/router/dist/router.js +1ms vite:resolve 0.25ms html-parse-stringify -> /workspaces/[project]/node_modules/.pnpm/html-parse-stringify@3.0.1/node_modules/html-parse-stringify/dist/html-parse-stringify.module.js +0ms vite:resolve 0.26ms side-channel -> /workspaces/[project]/node_modules/.pnpm/side-channel@1.0.6/node_modules/side-channel/index.js +1ms vite:resolve 0.19ms void-elements -> /workspaces/[project]/node_modules/.pnpm/void-elements@3.1.0/node_modules/void-elements/index.js +1ms vite:resolve 0.30ms get-intrinsic -> /workspaces/[project]/node_modules/.pnpm/get-intrinsic@1.2.4/node_modules/get-intrinsic/index.js +2ms vite:resolve 0.19ms call-bind/callBound -> /workspaces/[project]/node_modules/.pnpm/call-bind@1.0.7/node_modules/call-bind/callBound.js +0ms vite:resolve 0.18ms object-inspect -> /workspaces/[project]/node_modules/.pnpm/object-inspect@1.13.1/node_modules/object-inspect/index.js +1ms vite:resolve 0.17ms es-errors/type -> /workspaces/[project]/node_modules/.pnpm/es-errors@1.3.0/node_modules/es-errors/type.js +0ms vite:resolve 0.16ms es-errors -> /workspaces/[project]/node_modules/.pnpm/es-errors@1.3.0/node_modules/es-errors/index.js +1ms vite:resolve 0.32ms function-bind -> /workspaces/[project]/node_modules/.pnpm/function-bind@1.1.2/node_modules/function-bind/index.js +1ms vite:resolve 0.10ms es-errors/eval -> /workspaces/[project]/node_modules/.pnpm/es-errors@1.3.0/node_modules/es-errors/eval.js +0ms vite:resolve 0.07ms es-errors/range -> /workspaces/[project]/node_modules/.pnpm/es-errors@1.3.0/node_modules/es-errors/range.js +0ms vite:resolve 0.18ms set-function-length -> /workspaces/[project]/node_modules/.pnpm/set-function-length@1.2.2/node_modules/set-function-length/index.js +0ms vite:resolve 0.28ms es-errors/ref -> /workspaces/[project]/node_modules/.pnpm/es-errors@1.3.0/node_modules/es-errors/ref.js +1ms vite:resolve 0.19ms es-errors/syntax -> /workspaces/[project]/node_modules/.pnpm/es-errors@1.3.0/node_modules/es-errors/syntax.js +0ms vite:resolve 0.27ms es-define-property -> /workspaces/[project]/node_modules/.pnpm/es-define-property@1.0.0/node_modules/es-define-property/index.js +0ms vite:resolve 0.22ms es-errors/uri -> /workspaces/[project]/node_modules/.pnpm/es-errors@1.3.0/node_modules/es-errors/uri.js +1ms vite:resolve 0.29ms has-symbols -> /workspaces/[project]/node_modules/.pnpm/has-symbols@1.0.3/node_modules/has-symbols/index.js +0ms vite:resolve 0.30ms define-data-property -> /workspaces/[project]/node_modules/.pnpm/define-data-property@1.1.4/node_modules/define-data-property/index.js +1ms vite:resolve 0.32ms has-proto -> /workspaces/[project]/node_modules/.pnpm/has-proto@1.0.3/node_modules/has-proto/index.js +0ms vite:resolve 0.30ms has-property-descriptors -> /workspaces/[project]/node_modules/.pnpm/has-property-descriptors@1.0.2/node_modules/has-property-descriptors/index.js +0ms vite:resolve 0.28ms @refinedev/devtools-internal -> /workspaces/[project]/node_modules/.pnpm/@refinedev+devtools-internal@1.1.7_@types+react-dom@18.2.25_@types+react@18.2.78_react-dom@18_z7ueuktsdfo7rbo7vhgur3irpm/node_modules/@refinedev/devtools-internal/dist/index.mjs +9ms vite:resolve 0.27ms gopd -> /workspaces/[project]/node_modules/.pnpm/gopd@1.0.1/node_modules/gopd/index.js +1ms vite:resolve 0.29ms hasown -> /workspaces/[project]/node_modules/.pnpm/hasown@2.0.2/node_modules/hasown/index.js +0ms vite:resolve 0.48ms @tanstack/react-query -> /workspaces/[project]/node_modules/.pnpm/@tanstack+react-query@4.36.1_react-dom@18.2.0_react@18.2.0__react@18.2.0/node_modules/@tanstack/react-query/build/lib/index.mjs +1ms vite:resolve 0.48ms lodash-es/differenceWith.js -> /workspaces/[project]/node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/differenceWith.js +1ms vite:resolve 0.11ms lodash-es/unionWith.js -> /workspaces/[project]/node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/unionWith.js +1ms vite:resolve 0.31ms warn-once -> /workspaces/[project]/node_modules/.pnpm/warn-once@0.1.1/node_modules/warn-once/index.js +1ms vite:resolve 0.09ms lodash-es/fromPairs.js -> /workspaces/[project]/node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/fromPairs.js +0ms vite:resolve 0.08ms lodash-es/zip.js -> /workspaces/[project]/node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/zip.js +0ms vite:resolve 0.19ms pluralize -> /workspaces/[project]/node_modules/.pnpm/pluralize@8.0.0/node_modules/pluralize/pluralize.js +1ms vite:resolve 0.08ms lodash-es/debounce.js -> /workspaces/[project]/node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/debounce.js +0ms vite:resolve 0.08ms lodash-es/isEqual.js -> /workspaces/[project]/node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/isEqual.js +0ms vite:resolve 0.20ms papaparse -> /workspaces/[project]/node_modules/.pnpm/papaparse@5.4.1/node_modules/papaparse/papaparse.min.js +0ms vite:resolve 0.09ms lodash-es/chunk.js -> /workspaces/[project]/node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/chunk.js +1ms vite:resolve 0.08ms lodash-es/get.js -> /workspaces/[project]/node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/get.js +0ms vite:resolve 0.08ms lodash-es/uniqBy.js -> /workspaces/[project]/node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/uniqBy.js +0ms vite:resolve 0.38ms @tanstack/query-core -> /workspaces/[project]/node_modules/.pnpm/@tanstack+query-core@4.36.1/node_modules/@tanstack/query-core/build/lib/index.mjs +16ms vite:resolve 0.34ms error-stack-parser -> /workspaces/[project]/node_modules/.pnpm/error-stack-parser@2.1.4/node_modules/error-stack-parser/error-stack-parser.js +0ms vite:resolve 0.29ms @refinedev/devtools-shared -> /workspaces/[project]/node_modules/.pnpm/@refinedev+devtools-shared@1.1.5_@types+react-dom@18.2.25_@types+react@18.2.78_react-dom@18.2_y4bs4d4fl4msl4bjbmpvaw4opu/node_modules/@refinedev/devtools-shared/dist/index.mjs +2ms vite:resolve 1.53ms scheduler -> /workspaces/[project]/node_modules/.pnpm/scheduler@0.23.0/node_modules/scheduler/index.js +27ms vite:resolve 1.57ms stackframe -> /workspaces/[project]/node_modules/.pnpm/stackframe@1.3.4/node_modules/stackframe/stackframe.js +0ms vite:resolve 0.28ms use-sync-external-store/shim/index.js -> /workspaces/[project]/node_modules/.pnpm/use-sync-external-store@1.2.0_react@18.2.0/node_modules/use-sync-external-store/shim/index.js +6ms vite:deps Dependencies bundled in 120.62ms +123ms ```

Validations

mrjackwills commented 7 months ago

I had this same issue, there is a note about a windows container bug in the Docker release notes. They suggest using a ~/.config/daemon.json file to alter the default behavior - however in my system this still doesn't fix the issue.

But, the solution that worked for me was to run it with the --host argument, which then informs me I am able to connect via

➜  Local:   http://localhost:8002/
➜  Network: http://172.17.0.2:8002/

However, I am only able to connect via the first, localhost option (either http://127.0.0.1:8002 or http://localhost:8002). Without the --host argument, much like you describe, it is impossible to connect to the vite dev server at all.

EDIT: This issues seems only related to vite. When using another Docker dev Container, which exposes port 8282 to the host in a none vite environment, I am able to connect to the server correctly.

Running vite with --host 127.0.0.1 works, and only exposes locally.

This can also be achieved by editing the vite.config.ts to include

server: {
    port: 8002,
    host: '127.0.0.1'
}

I think that vite needs to change behaviour to use as default 127.0.0.1 instead of 0.0.0.0, but I am not sure what unintended consequences this would have

bluwy commented 7 months ago

Could this be related to ipv4 and ipv6? The host in Vite is "localhost" by default, which internally in Node, it resolves to either 127.0.0.1 or ::1 depending on the system. After starting the dev/preview server without --host, maybe you can explicitly access http://127.0.0.1:8002/ or http://[::1]:8002/ manually to see if it works.

mrjackwills commented 7 months ago

Could this be related to ipv4 and ipv6? The host in Vite is "localhost" by default, which internally in Node, it resolves to either 127.0.0.1 or ::1 depending on the system. After starting the dev/preview server without --host, maybe you can explicitly access http://127.0.0.1:8002/ or http://[::1]:8002/ manually to see if it works.

I just tried this, but was unable to connect over ipv6 via http://[::1]:8002/, nor still at http://127.0.0.1:8002/.

In my particular scenario, setting host: '127.0.0.1' in vite.config.ts still seems the quickest and easiest solution.

JonathonRP commented 7 months ago

I tried this because I've tried upgrading and downgrading everything and nothing has worked this after I had rebuilt my dev container and these steps have not resolved my issue...

sharky98 commented 7 months ago

Could this be related to ipv4 and ipv6? The host in Vite is "localhost" by default, which internally in Node, it resolves to either 127.0.0.1 or ::1 depending on the system. After starting the dev/preview server without --host, maybe you can explicitly access http://127.0.0.1:8002/ or http://[::1]:8002/ manually to see if it works.

I just tried this, but was unable to connect over ipv6 via http://[::1]:8002/, nor still at http://127.0.0.1:8002/.

In my particular scenario, setting host: '127.0.0.1' in vite.config.ts still seems the quickest and easiest solution.

Seems to do the trick for me.

Having Vite using host: "127.0.0.1" inside a dev container, I am able to access through http://localhost:4200/ on the host. However, using an explicit host: "localhost" does not work.

sapphi-red commented 7 months ago

It seems docker v26 started to return ::1 for localhost even if the host only uses IPv4. https://github.com/moby/moby/releases/tag/v26.0.0#:~:text=Always%20attempt%20to,include%20IPv6%20entries So in the container Vite listens on ::1 (because localhost resolves to ::1). But on the host machine, localhost resolves to 127.0.0.1. Does adding "runArgs": ["--sysctl net.ipv6.conf.all.disable_ipv6=1"] to .devcontainer.json work? If it does, I think it's caused by that change.

mrjackwills commented 7 months ago

Yes, using "runArgs":["--sysctl", "net.ipv6.conf.all.disable_ipv6=1"], I am able to connect to the dev server as before.

Again, I still think that setting host: '127.0.0.1' in vite.config.ts seems the quickest and easiest solution.

andreujuanc commented 6 months ago

It seems docker v26 started to return ::1 for localhost even if the host only uses IPv4. https://github.com/moby/moby/releases/tag/v26.0.0#:~:text=Always%20attempt%20to,include%20IPv6%20entries So in the container Vite listens on ::1 (because localhost resolves to ::1). But on the host machine, localhost resolves to 127.0.0.1. Does adding "runArgs": ["--sysctl net.ipv6.conf.all.disable_ipv6=1"] to .devcontainer.json work? If it does, I think it's caused by that change.

This is it! I thought It was a DevContainer thing, but it was actually a Docker one. I have a project where there is a vite server with the version pinned, the docker image is pinned, and the only things that changed in my system after the problem started were a new version of the extensions, and I updated my local docker.
Initially I thought it was a DevContainer issue since I have had other problems in the past, but this time it seems like I jumped too fast to conclusions.

My current docker version: docker Docker version 26.1.3, build b72abbb dockerd: Docker version 26.1.3, build 8e96db1

Kallepan commented 6 months ago

I had a similar problem. Interestingly this option did not seem to work: "runArgs": ["--sysctl", "net.ipv6.conf.all.disable_ipv6=1"]. Instead I had to set host to true in vite.config.ts like so:

{...,
server: {
    host: true
}
...}
jbcpollak commented 6 months ago

I ran into this problem as well with Windows 11 and Docker 25 (not 26 as discussed above). The fix's mentioned above worked for me.

imaerials commented 5 months ago

Run into this problem today. Windows 11 , Docker 26 WSL2. I changed the configuration file to this:

export default defineConfig({
  plugins: [react()],
  server: {
    host: '0.0.0.0'
  }
})

and it worked.

GeorgeAndreiBals commented 5 months ago

Can this be affected by proxy? I tried pretty much all of the above and still I can't access vite server from my host.

LE: it was due to .wslconfig in my userprofile that had mirroredNetwork option active.

fprotazio commented 4 months ago

It seems docker v26 started to return ::1 for localhost even if the host only uses IPv4. https://github.com/moby/moby/releases/tag/v26.0.0#:~:text=Always%20attempt%20to,include%20IPv6%20entries So in the container Vite listens on ::1 (because localhost resolves to ::1). But on the host machine, localhost resolves to 127.0.0.1. Does adding "runArgs": ["--sysctl net.ipv6.conf.all.disable_ipv6=1"] to .devcontainer.json work? If it does, I think it's caused by that change.

I wonder if that is the case because I spun up a docker container with a Dockerfile (no Dev Container) with Vite and it worked. The problem seems to appear only when I use Dev Container with Vite.

But, by the way, both "runArgs": ["--sysctl net.ipv6.conf.all.disable_ipv6=1"] and server: { host: '127.0.0.1'} commands did make it work.

Alex-Jongman commented 1 month ago

I've set the server to host: 0.0.0.0 and can now indeed acces the site in the browser. But changes to the code of the site hosted don't make it to the browser. Reloading the page and disabeling the cache don't have any effect. To see changes in the code I have to stop and start the dev server and have to reload the site twice.

Malix-Labs commented 1 month ago

Any plan about fixing it ?

I just tested it again, and it still seems to be broken on docker@latest + node@latest and docker@latest + deno@latest

bluwy commented 1 month ago

What do we need to fix? Vite defaults to localhost, and the system DNS tells Vite whether it should fallback to ipv4 (127.0.0.1) or ipv6 (::1). Docker v26 is telling Vite to use ::1 so it uses that, same as how it'll work on your machine locally. We don't want to force default ipv4 as noted at https://github.com/vitejs/vite/pull/8543

This seems more like a necessary configuration if you use Docker v26 with how the default works now as explained in https://github.com/vitejs/vite/issues/16522#issuecomment-2084322973

Malix-Labs commented 1 month ago

What would it get for it to "just work™" with no option added ?

Would it be a patch in Docker ?

Otherwise, would there be a way for vite to introduce a create-vite CLI option to add a field in vite.config.ts to make it work OOTB ?

Currently, Vite dev doesn't work OOTB in devcontainers, which is arguably suboptimal

bluwy commented 1 month ago

That'll mean Vite hardcoding special handling for Docker, which I don't think it should do. It has to start accounting for different docker versions and configurations, which is a can of worms.

The other option is to not have Docker misalign on the ipv4 and ipv6 settings, but from what I understand it was an intentional decision.

So from both ends, there isn't really a reasonable fix here. Maybe I miss a general heuristic Vite could use which you can point out on?

Malix-Labs commented 1 month ago

Maybe I miss a general heuristic Vite could use which you can point out on?

Nope I also do not have any idea on how to enhance the situation

I am simply considering it quite painful for all Vite + Docker Devcontainers users

fprotazio commented 1 month ago

That'll mean Vite hardcoding special handling for Docker, which I don't think it should do. It has to start accounting for different docker versions and configurations, which is a can of worms.

The other option is to not have Docker misalign on the ipv4 and ipv6 settings, but from what I understand it was an intentional decision.

So from both ends, there isn't really a reasonable fix here. Maybe I miss a general heuristic Vite could use which you can point out on?

To be honest, I don't think this is necessarily a docker/vite problem. As I said in my comment above, the issue only happens when using docker, vite and Dev Container.

When I tried docker and vite, that is, without dev container, it worked as before.

Malix-Labs commented 1 month ago

Workarounds

  1. vite.config.ts : server: { host: '127.0.0.1'}
  2. vite.config.ts : server: { host: '0.0.0.0'}
  3. vite.config.ts : server: { host: true}
  4. .devcontainer/devcontainer.json : "runArgs": ["--sysctl net.ipv6.conf.all.disable_ipv6=1"]

Which is the "best" to use ?

Malix-Labs commented 1 month ago

Thanks @fprotazio, I fixed my comment

bluwy commented 1 month ago

If specifically devcontainers, I think my points above still stands. If neither side is changing the behaviour to make this work ootb, we could fallback to documentation.

sapphi-red commented 1 month ago

Probably VSCode's port forwarding feature needs to support IPv6. https://github.com/microsoft/vscode-remote-release/issues/7029

fprotazio commented 1 month ago

If specifically devcontainers, I think my points above still stands. If neither side is changing the behaviour to make this work ootb, we could fallback to documentation.

Absolutely. I was just trying to clarify even further

bluwy commented 1 month ago

Let's perhaps document this at https://vite.dev/guide/troubleshooting.html#others then and link to the github issue sapphi sent above to follow the progress.

Malix-Labs commented 1 month ago

This is a good idea indeed

I mentioned this problem in the issue : https://github.com/microsoft/vscode-remote-release/issues/7029#issuecomment-2434801900

By the way, can someone please kindly answer this question:

Which is the "best" workaround to use ?

sapphi-red commented 1 month ago

Which is the "best" workaround to use ?

I think server: { host: '127.0.0.1' } is the best because the binding range is smaller.