web-dev-qa-db-ja.com

Webpack cant compile ts 3.7(Optional Chaining、Nullish Coalescing)

TypeScript 3.7オプションのチェーン、無効な結合などの機能。しかし、webpackを使用すると、変換中にエラーが発生します。

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);
``

21
Edgaras Karka

コードをトランスプルするために使用しているローダーに応じて、いくつかのオプションが利用可能です

ts-loaderの場合、TypeScriptからの出力がWebpackで理解できることを確認する必要があります。これは、ES2018targettsconfig.jsonに設定することで実現できます。

babel-loaderの場合、バベルがロードすることを確認する必要があります

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

プラグイン。 preset-envを使用している場合、targetsまたはbrowserlistに応じて、このプラグインがロードされる場合とロードされない場合があります(つまり、ターゲット環境がこれらの言語機能のサポート)。その場合、その組み込み方法は、babel.config.jsplugins配列に手動で指定することです。

0
aryzing