Búsqueda de sitios web

vue.js - Cómo hacer que los errores de TypeScript coincidan con el número de línea original en un proyecto Vue + TS + Webpack

Así que he configurado un proyecto Vue con Webpack, luego instalé los loaders adecuados y pasé a TypeScript dentro de mis SFCs. Todo funciona bien, excepto que los errores de TS detectados durante el tiempo de compilación se muestran de acuerdo con los archivos compilados, lo que hace que la depuración sea difícil.

Mi configuración de Webpack se ve así:

// ...
module.exports = {
  // ...
  module: {
    rules: [
      {
        test: /\.vue$/,
        use: 'vue-loader',
      },
      {
        test: /\.tsx?$/,
        loader: 'ts-loader',
        options: {
          appendTsSuffixTo: [/\.vue$/]
        }
      },
      {
        test: /\.css$/,
        use: [
          'vue-style-loader',
          'css-loader',
          'postcss-loader'
        ]
      },
      {
        test: /\.png$/,
        use: 'file-loader'
      }
    ]
  }
}

Entonces, los archivos .vue son convertidos por el ts-loader durante el tiempo de compilación, y termino obteniendo errores como este en mi salida de Webpack:

ERROR in /home/mega/savitri/packages/frontend/src/components/molecules/CSearch/CSearch.vue.ts
52:29-59
[tsl] ERROR in /home/mega/savitri/packages/frontend/src/components/molecules/CSearch/CSearch.vue.ts(52,30)
      TS2571: Object is of type 'unknown'.
ts-loader-default_0c5a263502dc9404

ERROR in /home/mega/savitri/packages/frontend/src/components/molecules/CSearch/CSearch.vue.ts
57:27-39
[tsl] ERROR in /home/mega/savitri/packages/frontend/src/components/molecules/CSearch/CSearch.vue.ts(57,28)
      TS2571: Object is of type 'unknown'.
ts-loader-default_0c5a263502dc9404

ERROR in /home/mega/savitri/packages/frontend/src/components/molecules/CSearch/CSearch.vue.ts
66:27-39
[tsl] ERROR in /home/mega/savitri/packages/frontend/src/components/molecules/CSearch/CSearch.vue.ts(66,28)
      TS2571: Object is of type 'unknown'.
ts-loader-default_0c5a263502dc9404

ERROR in /home/mega/savitri/packages/frontend/src/components/molecules/CSearch/CSearch.vue.ts
74:42-54
[tsl] ERROR in /home/mega/savitri/packages/frontend/src/components/molecules/CSearch/CSearch.vue.ts(74,43)
      TS2571: Object is of type 'unknown'.
ts-loader-default_0c5a263502dc9404

Buscando por ahí, me he encontrado con varias respuestas sobre los mapas de origen, pero hasta donde sé, esto solo sirve para la depuración en las herramientas de desarrollo. ¿Cómo puedo hacer que los errores coincidan con los archivos originales para poder resolverlos?

Artículos relacionados