Stack overflow when logging large messages

[SimenB]

Describe the bug

vite build hangs for about 90 seconds on my machine, then blows up with

error during build:
RangeError: Maximum call stack size exceeded
    at String.substring (<anonymous>)
    at replaceClose (file:///Users/simen/repos/company-admin/node_modules/vite/dist/node/chunks/dep-DkOS1hkm.js:107:21)
    at replaceClose (file:///Users/simen/repos/company-admin/node_modules/vite/dist/node/chunks/dep-DkOS1hkm.js:110:30)
    at replaceClose (file:///Users/simen/repos/company-admin/node_modules/vite/dist/node/chunks/dep-DkOS1hkm.js:110:30)
    at replaceClose (file:///Users/simen/repos/company-admin/node_modules/vite/dist/node/chunks/dep-DkOS1hkm.js:110:30)
    at replaceClose (file:///Users/simen/repos/company-admin/node_modules/vite/dist/node/chunks/dep-DkOS1hkm.js:110:30)
    at replaceClose (file:///Users/simen/repos/company-admin/node_modules/vite/dist/node/chunks/dep-DkOS1hkm.js:110:30)
    at replaceClose (file:///Users/simen/repos/company-admin/node_modules/vite/dist/node/chunks/dep-DkOS1hkm.js:110:30)
    at replaceClose (file:///Users/simen/repos/company-admin/node_modules/vite/dist/node/chunks/dep-DkOS1hkm.js:110:30)
    at replaceClose (file:///Users/simen/repos/company-admin/node_modules/vite/dist/node/chunks/dep-DkOS1hkm.js:110:30)

Placing a breakpoint inside replaceClose shows vite trying to log a 37 MB string.

This lead me to evanw/esbuild#3335, and the fix in my case is to not target old browsers like ios safari or ie 10.

Fix in Vite is probably the same as in vitest-dev/vitest#3078 (i.e. limit the size of messages logged)

Reproduction

https://github.com/SimenB/vite-overflow

Steps to reproduce

yarn install && yarn build will show a lot of logging - scale that up to a big project and you're gonna have a bad time

System Info

System:
    OS: macOS 14.4.1
    CPU: (12) arm64 Apple M2 Max
    Memory: 4.75 GB / 64.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.11.1 - ~/Library/Caches/fnm_multishells/98672_1714571486742/bin/node
    Yarn: 1.22.20 - ~/Library/Caches/fnm_multishells/98672_1714571486742/bin/yarn
    npm: 10.2.4 - ~/Library/Caches/fnm_multishells/98672_1714571486742/bin/npm
    pnpm: 8.10.0 - ~/Library/Caches/fnm_multishells/98672_1714571486742/bin/pnpm
  Browsers:
    Chrome: 124.0.6367.119
    Edge: 124.0.2478.67
    Safari: 17.4.1
  npmPackages:
    vite: ^5.2.0 => 5.2.10

Used Package Manager

yarn

Logs

Click to expand!

yarn run v1.22.20
$ vite build --debug
2024-05-01T13:56:43.307Z vite:config bundled config file loaded in 10.32ms
2024-05-01T13:56:43.319Z vite:config using resolved config: {
  build: {
    target: 'ie10',
    cssTarget: 'ie10',
    outDir: 'dist',
    assetsDir: 'assets',
    assetsInlineLimit: 4096,
    cssCodeSplit: true,
    sourcemap: false,
    rollupOptions: {},
    minify: 'esbuild',
    terserOptions: {},
    write: true,
    emptyOutDir: null,
    copyPublicDir: true,
    manifest: false,
    lib: false,
    ssr: false,
    ssrManifest: false,
    ssrEmitAssets: false,
    reportCompressedSize: true,
    chunkSizeWarningLimit: 500,
    watch: null,
    commonjsOptions: { include: [Array], extensions: [Array] },
    dynamicImportVarsOptions: { warnOnError: true, exclude: [Array] },
    modulePreload: { polyfill: true },
    cssMinify: true
  },
  configFile: '/Users/simen/repos/vite-overflow/vite.config.mjs',
  configFileDependencies: [ '/Users/simen/repos/vite-overflow/vite.config.mjs' ],
  inlineConfig: {
    root: undefined,
    base: undefined,
    mode: undefined,
    configFile: undefined,
    logLevel: undefined,
    clearScreen: undefined,
    build: {}
  },
  root: '/Users/simen/repos/vite-overflow',
  base: '/',
  rawBase: '/',
  resolve: {
    mainFields: [ 'browser', 'module', 'jsnext:main', 'jsnext' ],
    conditions: [],
    extensions: [
      '.mjs',  '.js',
      '.mts',  '.ts',
      '.jsx',  '.tsx',
      '.json'
    ],
    dedupe: [],
    preserveSymlinks: false,
    alias: [ [Object], [Object] ]
  },
  publicDir: '/Users/simen/repos/vite-overflow/public',
  cacheDir: '/Users/simen/repos/vite-overflow/node_modules/.vite',
  command: 'build',
  mode: 'production',
  ssr: {
    target: 'node',
    optimizeDeps: { noDiscovery: true, esbuildOptions: [Object] }
  },
  isWorker: false,
  mainConfig: null,
  bundleChain: [],
  isProduction: true,
  plugins: [
    'vite:build-metadata',
    'vite:watch-package-data',
    'vite:pre-alias',
    'alias',
    'vite:modulepreload-polyfill',
    'vite:resolve',
    'vite:html-inline-proxy',
    'vite:css',
    'vite:esbuild',
    'vite:json',
    'vite:wasm-helper',
    'vite:worker',
    'vite:asset',
    'vite:wasm-fallback',
    'vite:define',
    'vite:css-post',
    'vite:build-html',
    'vite:worker-import-meta-url',
    'vite:asset-import-meta-url',
    'vite:force-systemjs-wrap-complete',
    'commonjs',
    'vite:data-uri',
    'vite:dynamic-import-vars',
    'vite:import-glob',
    'vite:build-import-analysis',
    'vite:esbuild-transpile',
    'vite:terser',
    'vite:reporter',
    'vite:load-fallback'
  ],
  css: { lightningcss: undefined },
  esbuild: { jsxDev: false },
  server: {
    preTransformRequests: true,
    sourcemapIgnoreList: [Function: isInNodeModules$1],
    middlewareMode: false,
    fs: {
      strict: true,
      allow: [Array],
      deny: [Array],
      cachedChecks: undefined
    }
  },
  preview: {
    port: undefined,
    strictPort: undefined,
    host: undefined,
    https: undefined,
    open: undefined,
    proxy: undefined,
    cors: undefined,
    headers: undefined
  },
  envDir: '/Users/simen/repos/vite-overflow',
  env: { BASE_URL: '/', MODE: 'production', DEV: false, PROD: true },
  assetsInclude: [Function: assetsInclude],
  logger: {
    hasWarned: false,
    info: [Function: info],
    warn: [Function: warn],
    warnOnce: [Function: warnOnce],
    error: [Function: error],
    clearScreen: [Function: clearScreen],
    hasErrorLogged: [Function: hasErrorLogged]
  },
  packageCache: Map(1) {
    'fnpd_/Users/simen/repos/vite-overflow' => {
      dir: '/Users/simen/repos/vite-overflow',
      data: [Object],
      hasSideEffects: [Function: hasSideEffects],
      webResolvedImports: {},
      nodeResolvedImports: {},
      setResolvedCache: [Function: setResolvedCache],
      getResolvedCache: [Function: getResolvedCache]
    },
    set: [Function (anonymous)]
  },
  createResolver: [Function: createResolver],
  optimizeDeps: {
    holdUntilCrawlEnd: true,
    esbuildOptions: { preserveSymlinks: false }
  },
  worker: { format: 'iife', plugins: '() => plugins', rollupOptions: {} },
  appType: 'spa',
  experimental: { importGlobRestoreExtension: false, hmrPartialAccept: false },
  getSortedPlugins: [Function: getSortedPlugins],
  getSortedPluginHooks: [Function: getSortedPluginHooks]
}
vite v5.2.10 building for production...
transforming...
✓ 7 modules transformed.
2024-05-01T13:56:43.364Z vite:esbuild esbuild error with options used:  {
  sourcemap: true,
  sourcefile: 'assets/index-!~{001}~.js',
  charset: 'utf8',
  jsxDev: false,
  loader: 'js',
  target: 'ie10',
  format: 'esm',
  supported: { 'dynamic-import': true, 'import-meta': true },
  minify: true,
  treeShaking: true,
  tsconfigRaw: { compilerOptions: { useDefineForClassFields: false } }
}
x Build failed in 35ms
error during build:
Error: [vite:esbuild-transpile] Transform failed with 13 errors:
assets/index-!~{001}~.js:2:4: ERROR: Transforming const to the configured target environment ("ie10" + 2 overrides) is not supported yet
assets/index-!~{001}~.js:6:9: ERROR: Transforming const to the configured target environment ("ie10" + 2 overrides) is not supported yet
assets/index-!~{001}~.js:6:20: ERROR: Transforming for-of loops to the configured target environment ("ie10" + 2 overrides) is not supported yet
assets/index-!~{001}~.js:10:13: ERROR: Transforming const to the configured target environment ("ie10" + 2 overrides) is not supported yet
assets/index-!~{001}~.js:10:28: ERROR: Transforming for-of loops to the configured target environment ("ie10" + 2 overrides) is not supported yet
...

Transforming const to the configured target environment ("ie10" + 2 overrides) is not supported yet
1  |  true&&(function polyfill() {
2  |      const relList = document.createElement('link').relList;
   |      ^
3  |      if (relList && relList.supports && relList.supports('modulepreload')) {
4  |          return;

Transforming const to the configured target environment ("ie10" + 2 overrides) is not supported yet
4  |          return;
5  |      }
6  |      for (const link of document.querySelectorAll('link[rel="modulepreload"]')) {
   |           ^
7  |          processPreload(link);
8  |      }

Transforming for-of loops to the configured target environment ("ie10" + 2 overrides) is not supported yet
4  |          return;
5  |      }
6  |      for (const link of document.querySelectorAll('link[rel="modulepreload"]')) {
   |                      ^
7  |          processPreload(link);
8  |      }

Transforming const to the configured target environment ("ie10" + 2 overrides) is not supported yet
8  |      }
9  |      new MutationObserver((mutations) => {
10 |          for (const mutation of mutations) {
   |               ^
11 |              if (mutation.type !== 'childList') {
12 |                  continue;

Transforming for-of loops to the configured target environment ("ie10" + 2 overrides) is not supported yet
8  |      }
9  |      new MutationObserver((mutations) => {
10 |          for (const mutation of mutations) {
   |                              ^
11 |              if (mutation.type !== 'childList') {
12 |                  continue;

Transforming const to the configured target environment ("ie10" + 2 overrides) is not supported yet
12 |                  continue;
13 |              }
14 |              for (const node of mutation.addedNodes) {
   |                   ^
15 |                  if (node.tagName === 'LINK' && node.rel === 'modulepreload')
16 |                      processPreload(node);

Transforming for-of loops to the configured target environment ("ie10" + 2 overrides) is not supported yet
12 |                  continue;
13 |              }
14 |              for (const node of mutation.addedNodes) {
   |                              ^
15 |                  if (node.tagName === 'LINK' && node.rel === 'modulepreload')
16 |                      processPreload(node);

Transforming const to the configured target environment ("ie10" + 2 overrides) is not supported yet
19 |      }).observe(document, { childList: true, subtree: true });
20 |      function getFetchOpts(link) {
21 |          const fetchOpts = {};
   |          ^
22 |          if (link.integrity)
23 |              fetchOpts.integrity = link.integrity;

Transforming const to the configured target environment ("ie10" + 2 overrides) is not supported yet
38 |          link.ep = true;
39 |          // prepopulate the load record
40 |          const fetchOpts = getFetchOpts(link);
   |          ^
41 |          fetch(link.href, fetchOpts);
42 |      }

Transforming const to the configured target environment ("ie10" + 2 overrides) is not supported yet
43 |  }());
44 |  
45 |  const javascriptLogo = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20aria-hidden='true'%20role='img'%20class='iconify%20iconify--logos'%20width='32'%20height='32'%20preserveAspectRatio='xMidYMid%20meet'%20viewBox='0%200%20256%20256'%3e%3cpath%20fill='%23F7DF1E'%20d='M0%200h256v256H0V0Z'%3e%3c/path%3e%3cpath%20d='m67.312%20213.932l19.59-11.856c3.78%206.701%207.218%2012.371%2015.465%2012.371c7.905%200%2012.89-3.092%2012.89-15.12v-81.798h24.057v82.138c0%2024.917-14.606%2036.259-35.916%2036.259c-19.245%200-30.416-9.967-36.087-21.996m85.07-2.576l19.588-11.341c5.157%208.421%2011.859%2014.607%2023.715%2014.607c9.969%200%2016.325-4.984%2016.325-11.858c0-8.248-6.53-11.17-17.528-15.98l-6.013-2.58c-17.357-7.387-28.87-16.667-28.87-36.257c0-18.044%2013.747-31.792%2035.228-31.792c15.294%200%2026.292%205.328%2034.196%2019.247l-18.732%2012.03c-4.125-7.389-8.591-10.31-15.465-10.31c-7.046%200-11.514%204.468-11.514%2010.31c0%207.217%204.468%2010.14%2014.778%2014.608l6.014%202.577c20.45%208.765%2031.963%2017.7%2031.963%2037.804c0%2021.654-17.012%2033.51-39.867%2033.51c-22.339%200-36.774-10.654-43.819-24.574'%3e%3c/path%3e%3c/svg%3e";
   |  ^
46 |  
47 |  const viteLogo = "/vite.svg";

Transforming const to the configured target environment ("ie10" + 2 overrides) is not supported yet
45 |  const javascriptLogo = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20aria-hidden='true'%20role='img'%20class='iconify%20iconify--logos'%20width='32'%20height='32'%20preserveAspectRatio='xMidYMid%20meet'%20viewBox='0%200%20256%20256'%3e%3cpath%20fill='%23F7DF1E'%20d='M0%200h256v256H0V0Z'%3e%3c/path%3e%3cpath%20d='m67.312%20213.932l19.59-11.856c3.78%206.701%207.218%2012.371%2015.465%2012.371c7.905%200%2012.89-3.092%2012.89-15.12v-81.798h24.057v82.138c0%2024.917-14.606%2036.259-35.916%2036.259c-19.245%200-30.416-9.967-36.087-21.996m85.07-2.576l19.588-11.341c5.157%208.421%2011.859%2014.607%2023.715%2014.607c9.969%200%2016.325-4.984%2016.325-11.858c0-8.248-6.53-11.17-17.528-15.98l-6.013-2.58c-17.357-7.387-28.87-16.667-28.87-36.257c0-18.044%2013.747-31.792%2035.228-31.792c15.294%200%2026.292%205.328%2034.196%2019.247l-18.732%2012.03c-4.125-7.389-8.591-10.31-15.465-10.31c-7.046%200-11.514%204.468-11.514%2010.31c0%207.217%204.468%2010.14%2014.778%2014.608l6.014%202.577c20.45%208.765%2031.963%2017.7%2031.963%2037.804c0%2021.654-17.012%2033.51-39.867%2033.51c-22.339%200-36.774-10.654-43.819-24.574'%3e%3c/path%3e%3c/svg%3e";
46 |  
47 |  const viteLogo = "/vite.svg";
   |  ^
48 |  
49 |  function setupCounter(element) {

Transforming let to the configured target environment ("ie10" + 2 overrides) is not supported yet
48 |  
49 |  function setupCounter(element) {
50 |    let counter = 0;
   |    ^
51 |    const setCounter = (count) => {
52 |      counter = count;

Transforming const to the configured target environment ("ie10" + 2 overrides) is not supported yet
49 |  function setupCounter(element) {
50 |    let counter = 0;
51 |    const setCounter = (count) => {
   |    ^
52 |      counter = count;
53 |      element.innerHTML = `count is ${counter}`;

    at failureErrorWithLog (/Users/simen/repos/vite-overflow/node_modules/esbuild/lib/main.js:1651:15)
    at /Users/simen/repos/vite-overflow/node_modules/esbuild/lib/main.js:849:29
    at responseCallbacks.<computed> (/Users/simen/repos/vite-overflow/node_modules/esbuild/lib/main.js:704:9)
    at handleIncomingPacket (/Users/simen/repos/vite-overflow/node_modules/esbuild/lib/main.js:764:9)
    at Socket.readFromStdout (/Users/simen/repos/vite-overflow/node_modules/esbuild/lib/main.js:680:7)
    at Socket.emit (node:events:518:28)
    at addChunk (node:internal/streams/readable:559:12)
    at readableAddChunkPushByteMode (node:internal/streams/readable:510:3)
    at Readable.push (node:internal/streams/readable:390:5)
    at Pipe.onStreamRead (node:internal/stream_base_commons:190:23)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.