ts-loader vs babel-loader i Typescript med webpack


Så jag försökte jämföra den output som kompilerad kod ger av dessa två kombinationer.

ts-loader

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

babel-loader

  use: {
      loader: 'babel-loader',
      options: {
        presets:
          [
            "@babel/preset-react",
            "@babel/preset-typescript",
          ]
      }
    }
  • Jag får kompileringstider för babel-loader som är lägre än för ts-loader.
  • Dessutom verkar ts-loader använda babel under huven, åtminstone finns det i dess beroenden.
  • Dessutom tillåter babel-loader att använda cache med cacheDirectory

Frågor

  1. Finns det något sätt att använda cache i ts-loader som cacheDirectory i babel?
  2. Finns det några andra fördelar med att använda ts-loader istället för babel-loader?

Svar #1

för dina frågor:

  1. Som någon redan nämnt, finns det en experimentell inställning i ts-loader för att tillåta cache, du kan kolla konfigurationsreferensen för mer information: https://github.com/TypeStrong/ts-loader#experimentalfilecaching
  2. Såvitt jag vet gör Babel inte typkontroll på egen hand, så du skulle behöva köra TSC för det. Dessutom stöder det inte 'const enum'-syntaxen i ts...

Du kan också blanda de två, ha ts-loader för utveckling och babel för produktionsbyggen.

Relaterade artiklar