Webpack kann ts 3.7 nicht kompilieren (Optionale Verkettung, Nullish Coalescing)

21

Ich versuche, typescript 3.7Funktionen wie Optionale Verkettung und Nullish Coalescing zu verwenden. Aber webpackgibt mir einen Fehler beim Transpaling.

app: Module parse failed: Unexpected token (50:40)
app: File was processed with these loaders:
app:  * ../../../node_modules/ts-loader/index.js
app: You may need an additional loader to handle the result of these loaders.
app: | export const Layout = (props) => {
app: |     const regionsResults = useQuery(regionsQuery, { fetchPolicy: 'cache-first' });
app: >     const regions = regionsResults.data?.regions ?? [];
app: |     const userItem = useQuery(usersProfileQuery, { fetchPolicy: 'cache-first' });
app: |     const handleOnClick = (selected) => props.history.push(selected.key);
``

typescript webpack ts-loader

— Edgaras Karka
quelle

Kannst du deine packages.jsonDatei posten ?

— Carlos Crespo

30

Ich habe das Ziel geändert: esnextin es2018in tsconfig.jsonDatei. Jetzt funktioniert es.

— Edgaras Karka
quelle

6

Das hat bei mir nicht funktioniert. Webpack schlägt immer noch mit demselben Fehler fehl.

— Alejandro Corredor

Funktioniert nicht, wenn Sie "foo".matchAll(/o+/g)eine ES2020-Funktion verwenden.

— Jason Schilling

Das ist lächerlich, aber es funktioniert wirklich! Ich kann nicht einmal herausfinden, wie ... Optionales Channing erst seit ES2020. ES2018 und ES2019 funktionieren beide einwandfrei, übrigens stürzt ES2020 immer noch ab.

— Max Travis

1

Je nachdem, mit welchem Loader Sie den Code übertragen, stehen verschiedene Optionen zur Verfügung

Für ts-loader, müssen Sie sicher , dass die Ausgabe von Typoskript von Webpack ist verständlich zu machen. Dies kann durch Einstellen erreicht werdentarget auf ES2018in erreicht werden tsconfig.json.

Für babel-loadermüssen Sie sicherstellen, dass babel die lädt

@babel/plugin-proposal-nullish-coalescing-operator

Plugin. Beachten Sie, dass bei Verwendung preset-envdieses Plugins dieses Plugin möglicherweise geladen wird oder nicht, abhängig von Ihrem targetsoder browserlist(dh es wird nicht geladen, wenn die Zielumgebung diese Sprachfunktionen unterstützt). In diesem Fall ist dies die einzige Möglichkeit, die Aufnahme zu gewährleisten erfolgt durch manuelle Angabe im pluginsArray in babel.config.js,

  plugins: [
    '@babel/plugin-proposal-nullish-coalescing-operator',
  ],

— aryzing
quelle

-2

Wenn Sie vs code verwenden, sollten Sie wahrscheinlich die lokale Typoskriptversion gegen code use ändern.

Welche TypeScript-Version verwendet Visual Studio Code? Wie aktualisiere ich es?

— Alex Hyriavets
quelle