SyntaxError: 'import' and 'export' may appear only with 'sourceType: module' - Gulp

Question

Consider the following two files:

app.js

import Game       from \'./game/game\';
import React      from \'react\';
import ReactDOM   fro         


        

Answer 1

I came across the same error trying to import a module from node_modules that exports in ES6 style. Nothing that has been suggested on SO worked out for me. Then I found FAQ section on babelify repo. According to the insight from there, the error appears since modules from node_modules are not transpiled by default and ES6 declarations like export default ModuleName in them are not understood by node powered by Common.js-style modules.

So, I updated my packages and then used global option to run babelify as a global transform excluding all node modules but the one I was interested in as indicated on the babelify repo page:

...    
browserify.transform("babelify", 
    {
        presets: ["@babel/preset-env"], 
        sourceMaps: true, 
        global: true, 
        ignore: [/\/node_modules\/(?!your module folder\/)/]
    }).bundle()
...

Hope it helps.