Angular-Fullstack Requiring external module babel-

Question

I am getting this error when use gulp serve from a angular-fullstack project generator. Please, how can I solve this issue? The dependencie was set in package.json properly.

[18:03:54] Requiring external module babel-register
/home/gcfabri/Workspace/sportfitness/gulpfile.babel.js:4
import _ from 'lodash';
^^^^^^

SyntaxError: Unexpected token import
    at exports.runInThisContext (vm.js:53:16)
    at Module._compile (module.js:387:25)
    at loader (/home/gcfabri/node_modules/babel-register/lib/node.js:134:5)
    at Object.require.extensions.(anonymous function) [as .js] (/home/gcfabri/node_modules/babel-register/lib/node.js:144:7)
    at Module.load (module.js:357:32)
    at Function.Module._load (module.js:314:12)
    at Module.require (module.js:367:17)
    at require (internal/module.js:16:19)
    at Liftoff.handleArguments (/home/gcfabri/.npm-global/lib/node_modules/gulp/bin/gulp.js:116:3)
    at Liftoff.<anonymous> (/home/gcfabri/.npm-global/lib/node_modules/gulp/node_modules/liftoff/index.js:192:16)

Answer 1

It sounds like you need to run npm install --save babel-require. You can read more about it here.

Edit: Just to explain a bit better, the purpose of babel-require is to compile required packages with babel on the fly. In this case I'm assuming it's meant to be compiling ES6 javascript syntax back to ES5 syntax, because it's failing on the newer ES6 import syntax.

I'm not sure how babel ended up in your gulp pipeline there, but it's explicitly being required by something in /home/gcfabri/Workspace/sportfitness/gulpfile.babel.js. I wouldn't recommend removing it, but just so you have an idea of what's happening.

I hope installing that dependancy helps.