ts-loader vs babel-loader i Typescript ved bruk av webpack


Så jeg prøvde å sammenligne outputen av den kompilerte koden fra disse to kombinasjonene.

ts-loader

  {
    test: /\.tsx?$/,
    use: 'ts-loader',
  }

babel-loader

  use: {
      loader: 'babel-loader',
      options: {
        presets:
          [
            "@babel/preset-react",
            "@babel/preset-typescript",
          ]
      }
    }
  • Jeg får kompileringstider for babel-loader som er lavere enn for ts-loader.
  • Også ser det ut til at ts-loader bruker babel under panseret, i det minste finnes det i avhengighetene.
  • Også, babel-loader tillater bruk av cache med cacheDirectory

Spørsmål

  1. Finnes det en måte å bruke cache i ts-loader på, som cacheDirectory i babel?
  2. Er det noen andre fordeler ved å bruke ts-loader i stedet for babel-loader?

Svar #1

for dine spørsmål:

  1. Som noen allerede nevnte, finnes det en eksperimentell innstilling i ts-loader for å tillate cache, du kan sjekke konfigurasjonsreferansen for mer informasjon: https://github.com/TypeStrong/ts-loader#experimentalfilecaching
  2. Så vidt jeg vet gjør ikke Babel typekontroll på egen hånd, så du må kjøre TSC for det. Det støtter heller ikke 'const enum'-syntaksen i ts...

Du kan også blande de to, ha ts-loader for utvikling og babel for produksjonsbygg.

Relaterte artikler