Support for the experimental syntax 'flow' isn't currently enabled (7:8):

Question

I've been using a Mono repo to share react native components with react app. when I was trying to use a react native component from react, it has been showing an error which I couldn't resolve.

I've tried to follow the instructions like adding @babel/preset-flow to presets. But, still no use. Please help me out.

please Look At the error i've been facing:


   5 |
   6 | /* eslint-disable-next-line */
>  7 | export interface TestingProps {
     |        ^
   8 | }
   9 |
  10 |

Add @babel/preset-flow (https://github.com/babel/babel/tree/main/packages/babel-preset-flow) to the 'presets' section of your Babel config to enable transformation.
If you want to leave it as-is, add @babel/plugin-syntax-flow (https://github.com/babel/babel/tree/main/packages/babel-plugin-syntax-flow) to the 'plugins' section to enable parsing.
    at instantiate (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\parser\lib\index.js:67:32)  
    at constructor (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\parser\lib\index.js:364:12) 
    at Parser.raise (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\parser\lib\index.js:3365:19)
    at Parser.expectOnePlugin (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\parser\lib\index.js:3414:18)
    at Parser.isExportDefaultSpecifier (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\parser\lib\index.js:14261:16)
    at Parser.maybeParseExportDefaultSpecifier (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\parser\lib\index.js:14158:14)
    at Parser.parseExport (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\parser\lib\index.js:14088:29)
    at Parser.parseStatementContent (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\parser\lib\index.js:13073:27)
    at Parser.parseStatementLike (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\parser\lib\index.js:12952:17)
    at Parser.parseModuleItem (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\parser\lib\index.js:12933:17)
    at Parser.parseBlockOrModuleBlockBody (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\parser\lib\index.js:13558:36)
    at Parser.parseBlockBody (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\parser\lib\index.js:13550:10)
    at Parser.parseProgram (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\parser\lib\index.js:12842:10)
    at Parser.parseTopLevel (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\parser\lib\index.js:12832:25)
    at Parser.parse (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\parser\lib\index.js:14740:10)
    at parse (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\parser\lib\index.js:14782:38)     
    at parser (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\core\lib\parser\index.js:41:34)  
    at parser.next (<anonymous>)
    at normalizeFile (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\core\lib\transformation\normalize-file.js:66:38)
    at normalizeFile.next (<anonymous>)
    at run (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\core\lib\transformation\index.js:21:50)
    at run.next (<anonymous>)
    at transform (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\core\lib\transform.js:22:41)  
    at transform.next (<anonymous>)
    at step (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\gensync\index.js:261:32)
    at D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\gensync\index.js:273:13
    at async.call.result.err.err (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\gensync\index.js:223:11)
    at D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\gensync\index.js:189:28
    at D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\@babel\core\lib\gensync-utils\async.js:72:7     
    at D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\gensync\index.js:113:33
    at step (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\gensync\index.js:287:14)
    at D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\gensync\index.js:273:13
    at async.call.result.err.err (D:\workStation\Stacks\TurboRepoCrossPlatform\master\node_modules\gensync\index.js:223:11)

webpack compiled with 1 error (088b5b6bf6422082)```

If you're not using Flow type syntax, don't add `@babel/preset-flow`. — AKX, Nov 30 '22 at 06:15
To add to what AKX said, this seems to be TypeScript, not Flow. — Zac Anger, Nov 30 '22 at 06:18
@AKX There is no flow syntax added before that's where the error fires up and when I uploaded the presets and added @babel/presets-flow, nothing's different same error is showing up. — Arj-One, Nov 30 '22 at 06:19
From a cursory search on GitHub, it looks like there's some code that tries to automatically detect missing plugins based on syntax. This is not an answer, just a guess, but it could be that Babel is assuming you have Flow in your project when it's really TypeScript. — Zac Anger, Nov 30 '22 at 06:24
@Arj-One As I said, if you aren't using flow syntax, why would you "upload the presets and add @babel/presets-flow"? — AKX, Nov 30 '22 at 06:37
I came across this same error. I was able to resolve it with `"presets": ["@babel/preset-typescript"]` in my babel config. — mcjcloud, Dec 15 '22 at 18:05
@Arj-One not sure if you've figured this out yet, but this generally happens when you try and use a Typescript type as a value. babel gets confused as it tries to parse your value context as a type definition or vice versa. Make sure that you're not trying to do something like `Object.keys(MyType)` outside of a type definition — haxxxton, Feb 03 '23 at 02:42

score 6 · Answer 1 · answered Mar 21 '23 at 23:31

You need to install @babel/preset-typescript as a dev dependency and add to it your babel config.

npm install --save-dev @babel/preset-typescript

In your babel config (.babelrc) file should then add this to your presets:

"presets": ["@babel/preset-typescript"]

score 3 · Answer 2 · answered Apr 07 '23 at 07:48

3

First answer didn't work for me, but adding options to main.js helped:

babel: async (options) => {
        options.plugins.push('@babel/plugin-syntax-flow');
        options.presets.push('@babel/preset-typescript');
        return options;
    }

answered Apr 07 '23 at 07:48

Dragana

101
1
3
8

Support for the experimental syntax 'flow' isn't currently enabled (7:8):

2 Answers2