Is anyone experienced in…

1 minute read

Is anyone experienced in @nrwl/next ?

I did a migration from @nrwl/next@9.2.4 to @nrwl/next@9.4.5 . Before the migration nx used webpack to serve the next page, now it looks like it uses babel. I tried to start the dev-server of next.js with nx run web-frontend:serve and I get following error message Unexpected reserved word 'interface' (6:0) (btw I’m using typescript). What do I need to change in .babelrc to get it working again ? I am not really experienced in babel.

Current file contents: .babelrc { "presets": [ "@nrwl/react/babel" ], "plugins": [] }


I fixed this error but another one came up.

Current content: { "presets": [ "@nrwl/react/babel", "@babel/preset-typescript" ], "plugins": [] } Now I get ReferenceError: React is not defined . I need to take a closer look into babel and then have React defined in every file. (bc I do not want to import it in every file)

Hmm I’m also using nrwl/next but haven’t had these issues.

Could you please share your .babelrc ?

oh interesting, I seem to have changed it at some point

{ "presets": ["next/babel"], "plugins": [["styled-components", { "pure": true, "ssr": true }]] }

this is what it looks like for me

in the next.js app

but in the react libs it looks like yours { "presets": ["@nrwl/react/babel"], "plugins": [] }

It works now ! All I needed was this preset "next/babel" .

Thank you! :slightly_smiling_face: