Webpack не может скомпилировать ts 3.7 (опциональная цепочка, Nullish Coalescing)

21

Я пытаюсь использовать typescript 3.7такие функции, как Optional Chaining, Nullish Coalescing. Но 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);
``
typescript webpack ts-loader Эдгарас Карка
источник
Вы можете опубликовать свой packages.jsonфайл?
Карлос Креспо

Ответы:

30

Я изменил цель: esnextчтобы es2018в tsconfig.jsonфайле. Теперь это работает.

Эдгарас Карка
источник
6
Это не сработало для меня. Webpack по-прежнему не работает с той же ошибкой.
Алехандро Корредор
Не работает, если вы используете, "foo".matchAll(/o+/g)потому что это функция ES2020.
Джейсон Шиллинг
Это смешно, но это действительно работает! Я даже не могу понять, как ... Опциональное чаннинг принес нам только после ES2020. ES2018 и ES2019 работают нормально, кстати, ES2020 все еще падает.
Макс Трэвис
1

В зависимости от того, какой загрузчик вы используете для передачи кода, доступно несколько вариантов

Для ts-loader, вам нужно убедиться, что вывод из машинописного текста понятен Webpack. Это может быть достигнуто путем установки targetна ES2018в tsconfig.json.

Для babel-loader, вам необходимо убедиться , что Бабель загружает

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

плагин. Обратите внимание, что если вы используете preset-env, он может или не может загрузить этот плагин в зависимости от вашего targetsили browserlist(т.е. не будет загружен, если целевой env имеет поддержку этих языковых функций), и в этом случае единственный способ гарантировать его включение вручную указав его в pluginsмассиве babel.config.js,

  plugins: [
    '@babel/plugin-proposal-nullish-coalescing-operator',
  ],
aryzing
источник