Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

Unable to parse webpack source URLs, how to work around around?

Abierto
#500 3 comentarios 0 reacciones 0 asignados Ver en GitHub

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
4/5
Tiempo estimado
3-5 días
Aptitud para principiantes
25/100
Tipo de issue
Error
Claridad
Necesita aclaración
Estado de actividad
Estancado
Stack tecnológico
javascript, typescript
Área
tooling

Línea de trabajo

Comienza con la ruta que falla en lib/util.js alrededor de la línea 181 y, a continuación, sigue a sus llamadores en source-map-consumer.js alrededor de las líneas 206-207 y el ejemplo de webpack source-map proporcionado. Reproduce el error de análisis de URL con el código TypeScript proporcionado e inspecciona cómo se pasan las fuentes analizadas a computeSourceURL. Se considera terminado cuando las source URLs de webpack ya no provocan el error de decodificación indicado.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

It looks like it's failing right here:

https://github.com/mozilla/source-map/blob/60adcb064bf033702d954d6d3f9bc3635dcb744b/lib/util.js#L181

I have this code for parsing the string sourcemap from a JS file, but it's not working:


const CACHE: Record<string, SourceMapConsumer> = {}

async function loadFile(
  line: string,
): Promise<SourceMapConsumer | void> {
  const link = CACHE[`${line}`]
  if (link) {
    return link
  }

  const res = await fetch(line)
  const text = await res.text()
  const last = text.trim().split('\n').pop() ?? ''
  console.log(text)
  console.log(last)
  if (
    last.match(
      /(\/\/# sourceMappingURL=data:application\/json;charset=utf-8;base64,)/,
    )
  ) {
    console.log(last.slice(RegExp.$1.length))
    const json = JSON.parse(
      atob(last.slice(RegExp.$1.length)),
    ) as RawSourceMap
    json.sources.forEach((source, i) => {
      json.sources[i] = source.replace(/^webpack:\/\//g, 'http://')
    })
    console.log(json)

    const sm = await new SourceMapConsumer(json)
    CACHE[`${line}`] = sm
    return sm
  }
}

async function readFileLocation(
  file: string,
  line: number,
  rise: number,
): Promise<[string, number | undefined, number | undefined]> {
  const link = await loadFile(file)

  const trace = {
    column: rise,
    filename: file,
    line: line,
  }

  if (link) {
    const token = link.originalPositionFor(trace)
    if (token.source) {
      return [
        token.source,
        token.line == null ? undefined : token.line,
        token.column == null ? undefined : token.column,
      ]
    } else {
      return [file, line, rise]
    }
  } else {
    return [file, line, rise]
  }
}

export async function testSourceMaps(error: Error): Promise<string> {
  const stack = getFileLineColumn(error.stack?.split('\n') ?? [])
  const list: Array<string> = []

  for (const data of stack) {
    const [file, line, column] = await readFileLocation(
      data.file,
      data.line ?? 0,
      data.column ?? 0,
    )

    console.log(file, line, column)
  }
}

As you can see in the example, I tried to replace webpack:// with http:// but it didn't seem to help:

json.sources[i] = source.replace(/^webpack:\/\//g, 'http://')

How do I get this working, any suggestions? The error I'm getting is:

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'decode')
    at new URLStateMachine (url-state-machine.js:546:1)
    at module.exports.basicURLParse (url-state-machine.js:1264:1)
    at new URLImpl (URL-impl.js:13:1)
    at Object.setup (URL.js:317:1)
    at new URL (URL.js:26:1)
    at util.js:179:1
    at Object.computeSourceURL (util.js:431:1)
    at source-map-consumer.js:207:1
    at Array.map (<anonymous>)
    at source-map-consumer.js:206:1

The JSON looks liek this when I parse the sourcemap in this fashion:

Screenshot 2024-02-20 at 11 58 14 AM

Any help would be greatly appreciated. Thank you.

Lenguaje dominante
JavaScript
Estrellas
3.7k
Forks
370
Métricas de merge de PR
Sin PR fusionados en 30 d

Guía de contribución

Abrir la guía de contribución

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de mozilla/source-map

Todos los issues de mozilla/source-map

Issues similares

Más issues de JavaScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.