Unexpected token in createHandler.ts

[LMarcinkowski]

Description

error: SyntaxError: /Users/skodsgn/bmind/projects/smogity-mobile-app/node_modules/react-native-gesture-handler/src/handlers/createHandler.ts: Unexpected token (11:12)

   9 | import deepEqual from 'fbjs/lib/areEqual';
  10 | import RNGestureHandlerModule from '../RNGestureHandlerModule';
> 11 | import type RNGestureHandlerModuleWeb from '../RNGestureHandlerModule.web';
     |             ^
  12 | import { State } from '../State';
  13 | 
  14 | import {

Screenshots

Package versions

• React: 16.12.0
• React Native: 0.63.4
• React Native Gesture Handler: 1.10.1
• Typescript: 4.1.5

[jakub-gonet]

Do you use the standard RN setup? Its babel plugin should be able to strip TS types and type imports.

[Pratama-lab]

I have the same problem. How to fix it?

[jakub-gonet]

I have the same problem. How to fix it?

@Pratama-lab, same question, do you use RN babel plugin? Could you share your babel.config.js here?

[Pratama-lab]

I have the same problem. How to fix it?

@Pratama-lab, same question, do you use RN babel plugin? Could you share your babel.config.js here?

OK, can

module.exports = {
presets: ['module:metro-react-native-babel-preset', 'module:react-native-dotenv']
};

[rossedwardsus]

Same problem.

module.exports = {
presets: ['module:metro-react-native-babel-preset'],
};

[jakub-gonet]

What version of RN and metro-react-native-babel-preset plugin do you use? Are you able to create reproducible example app and link to it?

As a workaround, you can change react-native field in node_modules/react-native-gesture-handler/package.json to be the same as main field (lib/commonjs/index). Same goes for Swipeable/package.json and DrawerLayout.

[rossedwardsus]

react: 16.9.0 => 16.9.0
react-native: 0.61.5 => 0.61.5

"metro-react-native-babel-preset": "^0.58.0",

[Pratama-lab]

"react": "16.9.0"
"react-native": "^0.62.2"
"metro-react-native-babel-preset": "0.51.1"

[LMarcinkowski]

"metro-react-native-babel-preset": "^0.56.0"

[jakub-gonet]

I checked the metro-react-native-babel-preset@0.58.0 and @babel/plugin-transform-typescript@7.5.0. Seems like it's stripping type imports so I have no clue why metro can't load it. Please clear cache and provide a small repository that is reproducing this issue.

[johuder33]

I have the same issue, any clue about it ? by the way I removed the type in that line and it works, but it seems it's a problem with typescript syntax

[bahtiyarerden]

Hello i've solved this issue with updating

@babel/core and
@babel/runtime dependencies.

I hope it helps.

[jakub-gonet]

This is related to the author's package versions. You should use the Babel version that is able to strip type declarations. Try upgrading packages @bahtiyarerden listed. If the problem persists, please reply.

[thahaac]

Hello i've solved this issue with updating

@babel/core and @babel/runtime dependencies.

I hope it helps.

This fixed for me. Thank you.