Unexpected token { when trying gulp with JS ES6

Question

Am I using wrong version of some package or can you post me a link to the detailed tutorial or codepen where this syntax construction do not give me an error?

I am getting this error:

$ gulp D:\GIT\project02\gulpfile.js:20 const { COMPATIBILITY, PORT, UNCSS_OPTIONS, PATHS } = loadConfig(); ^ SyntaxError: Unexpected token { at exports.runInThisContext (vm.js:53:16) at Module._compile (module.js:413:25) at Object.Module._extensions..js (module.js:452:10) at Module.load (module.js:355:32) at Function.Module._load (module.js:310:12) at Module.require (module.js:365:17) at require (module.js:384:17) at execute (C:\Documents and Settings\Administrator\Application Data\npm\node_modules\gulp-cli\lib\versioned\^4.0.0-alpha.2\index.js:36:18) at Liftoff.handleArguments (C:\Documents and Settings\Administrator\Application Data\npm\node_modules\gulp-cli\index.js:172:63) at Liftoff.<anonymous> (C:\Documents and Settings\Administrator\Application Data\npm\node_modules\gulp-cli\node_modules\liftoff\index.js:198:16)

I've already read this question, but 'use strict'; was in my gulpfile, and changing const to let didn't worked for me.

My globally installed packages:

$ npm -g ls --depth=0 C:\Documents and Settings\Administrator\Application Data\npm ├── [email protected] ├── [email protected] ├── [email protected] ├── [email protected] ├── [email protected] └── [email protected] (git://github.com/gulpjs/gulp-cli.git#9b053ed9b7a63a10777c33b86b04ed38d7f5b840)

My Node is v4.0.0 and gulp that I am using in project:

$ gulp -v [14:15:06] CLI version 1.2.2 [14:15:06] Local version 4.0.0-alpha.2

Duplicate Question: stackoverflow.com/questions/33745118/… — Ihsahs
– Ihsahs, Commented Aug 30, 2016 at 11:31
@user2249160 not entirely a duplicate: the error here is because Gulpfile.js itself contains the destructuring statement. — robertklep
– robertklep, Commented Aug 30, 2016 at 11:39

Sebastian Sebald · Accepted Answer · 2016-08-30 11:34:58Z

As Konstantin already said, not all ES6 features are available in your Gulpfile, because node has to process those files. But there is an easy way to do this by using the babel-require hook.

Create a Gulpfile like this:

'use strict'; // Compile task to ES5 on the fly! require('babel-register'); // Require all tasks! require('require-dir')('./tasks', { recurse: true });

and put your tasks inside the tasks directory. Then create a .babelrc file to load a preset, e.g.

{ "presets": ["node5"] }

when you're using node v5.x. Now you can use ES6 features! :)

Thank you for you reply. It is very instructive! I will try it.

G07cha · Accepted Answer · 2016-08-30 11:30:13Z

Destructing is ES6 feature and it's officially supported starting from Node v6. So you should replace:

const { COMPATIBILITY, PORT, UNCSS_OPTIONS, PATHS } = loadConfig();

With:

const config = loadConfig(), COMPATIBILITY = config.COMPATIBILITY, PORT = config.PORT, UNCSS_OPTIONS = config.UNCSS_OPTIONS, PATHS = config.PATHS

Or update your Node version.

Collectives™ on Stack Overflow

Unexpected token { when trying gulp with JS ES6

2 Answers 2

1 Comment

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Linked

Related