Vite server fails when encountering source-map with sections #14573

Describe the bug

Overview

I'm creating a project that combines Vite as a dev server with another project that compiles ClojureScript to JavaScript. The issue I'm running into is related to Vite's server support for input source-maps, and in this case, Vite's support for "indexed source maps".

Description

Basically, I am compiling some code to JavaScript with some source-maps, but Vite's dev server displays an error because it fails at handling this different source-map structure. The error that is shown is something like this:

[vite] Internal server error: Cannot read properties of undefined (reading 'length')
      at loadAndTransform (file:///Users/seanstrom/Code/org-seanstrom/cljs-dev-template/node_modules/vite/dist/node/chunks/dep-79892de8.js:41126:63)

After investigating a little bit, it seems that Vite's server does not detect the different source-map format and fails to access certain properties because they're undefined. Specifically the sources field of the map.

Potential Solution

One potential solution would be to follow what Webpack does for these different source-maps, which involves "flattening" the "sections" of the different source-map into a normalized source-map that Vite would understand: webpack-contrib/source-map-loader#89

Though this solution could potentially require using an additional dependency for assembly source-maps, and here's the snippet of code of the flattening function. Here's a link to the flattening function that Webpack uses.

Reproduction

https://github.com/seanstrom/cljs-dev-template/tree/minimal-sourcemaps-debug

Steps to reproduce

If you want to reproduce the issue, please install some environment dependencies for Clojure related parts. Here's a list of all the environment dependencies required:

• Clojure
• Java
• Node
• NPM

After the environment dependencies are installed follow these steps:

• run npm install to install the JS / Node dependencies
• run npm app-cljs-prod to compile the ClojureScript with source-maps
• run npm app-js-dev to run the Vite dev server with compiled JS
• visit localhost:4000 and view the Vite log.

System Info

System:
    OS: macOS 13.6
    CPU: (16) x64 Intel(R) Core(TM) i9-9980HK CPU @ 2.40GHz
    Memory: 31.20 MB / 32.00 GB
    Shell: 3.6.0 - /usr/local/bin/fish
  Binaries:
    Node: 18.12.1 - ~/.asdf/installs/nodejs/18.12.1/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 8.19.2 - ~/.asdf/plugins/nodejs/shims/npm
    Watchman: 2023.09.04.00 - /usr/local/bin/watchman
  Browsers:
    Chrome: 117.0.5938.149
    Chrome Canary: 120.0.6058.0
    Safari: 17.0
    Safari Technology Preview: 17.4
  npmPackages:
    vite: ^4.2.1 => 4.2.1

Used Package Manager

npm

Logs

No response

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.