CODEWITHSUNDEEP
node.jsreactjsnpmbabeljsjsx
Corsarz Z Karaibów
Corsarz Z Karaibów

Reputation: 1

babel-node doesn't transpile JSX in npm react script for Node version 14

I'm having a big problem with running my npm script using babel-node. This script generates static error pages from react components. With Node versions 10 and 12 it is running successfully, but when I have updated my node version to 14 babel-node seems to stop transpiling JSX. Now I get this error:

   <MuiThemeProvider theme={theme}>
     ^

 SyntaxError: Unexpected token '<'
     at Loader.moduleStrategy (internal/modules/esm/translators.js:140:18)
     at async link (internal/modules/esm/module_job.js:42:21)

My devDependencies in package.json file:

 "devDependencies": {
    "@babel/node": "^7.14.2",
    "@babel/preset-env": "^7.14.2",
    "babel-plugin-styled-components": "^1.12.0",
    "prettier": "2.3.0"
  }

and script in package.json:

"generate-error-pages": "babel-node scripts/generate-error-pages.js"

And this is my .babelrc file:

{
  "presets": ["@babel/preset-env", "@babel/react"],
  "plugins": [["styled-components", { "ssr": true }]]
}

I can't make it work with Node version 14 like it worked with version 10 and 12.

Upvotes: 0

Views: 752

Answers (1)

Corsarz Z Karaib&#243;w
Corsarz Z Karaib&#243;w

Reputation: 1

Creating new repository helped me find the problem. In previous versions of Node I had to add

"type": "module"

in package.json because without it there was an exception caused by using import in JS script. Now I observed that in Node 14 I don't need "type": "module" anymore. This was even the problem of described exception. After deleting this from package.json it is now working also in Node 14.

Upvotes: 0

Related Questions