SyntaxError when NPM script is executed

Question

I'm trying to update the dependencies of a React app. This app includes a script defined in package.json which generates a message bundle for each locale.

"scripts": {
  "build:langs": "NODE_ENV=production babel-node scripts/mergeMessages.js"
}

The details of the script are unimportant, but it's very similar to this one, which is described in a react-intl tutorial.

Before upgrading the dependencies, the script worked, but now when I execute npm run build:langs on the command-line, I get this error:

/applications/my-app/scripts/mergeMessages.js:1
import _objectSpread from "/applications/my-app/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/objectSpread";
       ^^^^^^^^^^^^^

SyntaxError: Unexpected identifier
    at Module._compile (internal/modules/cjs/loader.js:703:23)
    at Module._compile (/applications/my-app/node_modules/pirates/lib/index.js:99:24)
    at Module._extensions..js (internal/modules/cjs/loader.js:770:10)
    at Object.newLoader [as .js] (/applications/my-app/node_modules/pirates/lib/index.js:104:7)
    at Module.load (internal/modules/cjs/loader.js:628:32)
    at Function.Module._load (internal/modules/cjs/loader.js:555:12)
    at Function.Module.runMain (internal/modules/cjs/loader.js:824:10)
    at Object.<anonymous> (/applications/my-app/node_modules/@babel/node/lib/_babel-node.js:234:23)
    at Module._compile (internal/modules/cjs/loader.js:759:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:770:10)

I guess the babel dependencies are the most relevant. Before the upgrade these were:

"babel-core": "6.26.0",
"babel-eslint": "7.2.3",
"babel-loader": "7.1.2",
"babel-plugin-react-intl": "2.4.0",
"babel-preset-react-app": "3.1.2",
"babel-cli": "6.26.0",

Following the upgrade, the babel dependencies are:

"@babel/core": "7.4.4",
"@babel/polyfill": "7.4.4",
"@babel/register": "7.4.4",
"babel-eslint": "10.0.1",
"babel-loader": "8.0.5",
"babel-plugin-named-asset-import": "^0.3.2",
"babel-preset-react-app": "^8.0.0",
"babel-plugin-react-intl": "2.4.0",
"@babel/cli": "~7.4.4",
"@babel/node": "7.2.2",

Update

I don't have either a .babelrc or babel.config.js config file, just the following in package.json

"babel": {
  "presets": [
    "react-app"
  ]
}

You're using a preset for create-react-app but you're not running it in create-react-app . It's only designed for that specific usecase. — loganfsmyth
– loganfsmyth, Commented May 8, 2019 at 16:25

Avanthika · Accepted Answer · 2019-05-08 16:14:43Z

1

If you are using babel-7, you need to have the following:

Try using @babel/preset-react instead of babel-preset-react-app.

"@babel/core": "^7.4.4",
"@babel/plugin-proposal-class-properties": "^7.4.4",
"@babel/preset-env": "^7.4.4",
"@babel/preset-react": "^7.0.0",
"babel-loader": "^8.0.5",

and babel-config in package.json should be:

{
  "presets": [
    "@babel/preset-env",
    "@babel/preset-react"
  ],
  "plugins": [
    "@babel/plugin-proposal-class-properties"
  ]
}

answered May 8, 2019 at 16:14

Avanthika

4,1821 gold badge15 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Dónal Over a year ago

I tried making the changes you suggested, but now I get "Error: Cannot find module 'babel-core'" in my script on the line const babel = require("babel-core");

Avanthika Over a year ago

It should be const babel = require("@babel/core");

Joe Clay · Accepted Answer · 2019-05-08 15:36:49Z

1

From the Babel 7 migration guide:

The babel-node command in Babel 6 was part of the babel-cli package. In Babel 7, this command has been split out into its own @babel/node package, so if you are using that command, you'll want to add this new dependency.

answered May 8, 2019 at 15:36

Joe Clay

36.1k6 gold badges94 silver badges90 bronze badges

3 Comments

Dónal Over a year ago

I added @babel/node just before you posted your answer, but now I get a different error. I've updated my question with the details.

Joe Clay Over a year ago

@Dónal: It seems like Babel is not compiling the import syntax into require calls (bear in mind that Node does not natively support ES modules yet). Could you please provide the contents of your .babelrc/babel.config.js file?

Dónal Over a year ago

Thanks for your help. I've updated my question with the info you requested.

Collectives™ on Stack Overflow

SyntaxError when NPM script is executed

Update

2 Answers 2

2 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

Update

2 Answers 2

2 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related