Mixing
Spread Operator throws SyntaxError even after Babel Configuration in Webstorm 2018.3
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
Webstorm / OS
Webstorm 2018.3/Windows 10
Node/NPM
v8.0.0/6.4.1
Steps followed
JetBrains ECMAScript6 in Webstorm Babel FileWatcher
I added
Babelthrough the steps
For a local repository I installed
npm i --save-dev @babel/cli @babel/core @babel/preset-env @babel/plugin-object-proposed-rest-spread
added
.babelrcin the root folder with following:
{
"presets": ["@babel/preset-env"],
"plugins": ["@babel/plugin-proposal-object-rest-spread"]
}
Configured my Run Configuration for
npm startsince mypackage.jsonhas"start": nodemon app.jsin it.
Application
I am using mongoose to store and obtain information from MongoDB and using GraphQL to provide an endpoint for queries/mutation
here is one of my mutation (function) within my code:
createEvent: (args) => {
const event = new Event({
title: args.eventInput.title,
description: args.eventInput.description,
price: +args.eventInput.price,
date: new Date(args.eventInput.date)
});
return event
.save()
.then(result => {
console.log(result);
return { ...result._doc };
})
.catch(err => {
console.log(err);
throw err;
});
}
Error:
SyntaxError: Unexpected token ...
Steps Followed Again
According to SE Query to Configure Babel with Webstorm for node.js project I tried creating a node.js app but I now get an Error:
Error: querySrv ENOTFOUND _mongodb._tcp.undefined-p8e7q.mongodb.net
at errnoException (dns.js:50:10)
at QueryReqWrap.onresolve [as oncomplete] (dns.js:244:19)
code: 'ENOTFOUND',
errno: 'ENOTFOUND',
syscall: 'querySrv',
hostname: '_mongodb._tcp.undefined-p8e7q.mongodb.net'
I now instead replace { ...result._doc } with return result._doc and the code works fine but I wish to use the spread operator within other blocks of code.
I understand that the error has nothing to do with Webstorm but I do not see any other alternative to this problem
Edit
File Watcher Babel
NPM Configuration
Node.js Configuration
created by right-click on app.js file and Create 'app.js' from menu. I installed npm i --save-dev @babel/register and changed it to -r @babel/register as mentioned in the blog
app.js
const express = require('express'); // Add Express Module
const bodyParser = require('body-parser'); // Add Body-Parser Middleware for JSON handling in Requests
const graphqlHttp = require('express-graphql'); // Add Middleware for GraphQL Resolvers over Express HTTP
const { buildSchema } = require('graphql'); // Javascript Object-Destructuring (pull objects from packages)
const mongoose = require('mongoose'); // MongoDB Third-Party package
const Event = require('./models/event'); // MongoDB Event Model
const app = express();
app.use(bodyParser.json()); // JSON parsing Middleware added
app.use('/graphql', graphqlHttp({
schema: buildSchema(`
type Event {
_id: ID!
title: String!
description: String!
price: Float!
date: String!
}
input EventInput {
title: String!
description: String!
price: Float!
date: String!
}
type RootQuery {
events: [Event!]!
}
type RootMutation {
createEvent(eventInput: EventInput): Event
}
schema {
query: RootQuery
mutation: RootMutation
}
`),
rootValue: {
events: () => {
return Event.find()
.then(events => {
return events.map( event => {
event._doc._id = event.id;
return event._doc;
});
})
.catch(err => {
console.log(err);
throw err;
})
},
createEvent: (args) => {
const event = new Event({
title: args.eventInput.title,
description: args.eventInput.description,
price: +args.eventInput.price,
date: new Date(args.eventInput.date)
});
return event
.save()
.then(result => {
console.log(result);
return { ...result._doc };
// return result._doc
})
.catch(err => {
console.log(err);
throw err;
});
}
},
graphiql: true
}));
mongoose.connect(
`mongodb+srv://${process.env.MONGO_USER}:${process.env.MONGO_PASSWORD}@${process.env.MONGO_CLUSTER_NAME}-p8e7q.mongodb.net/${process.env.MONGO_DB_NAME}?retryWrites=true`)
.then( () => {
app.listen(3000);
}).catch(err => {
console.log(err);
});
package.json
I added some weird babel packages as some desperate attempt to get it up and running which is in dev-dependencies
{
"name": "graphql-express-app",
"version": "0.0.4",
"description": "Academind's YouTube Series on GraphQL-Express-React",
"main": "app.js",
"scripts": {
"test": "echo "Error: no test specified" && exit 1",
"start": "nodemon app.js"
},
"keywords": [
"graphql",
"express",
"node.js"
],
"author": "",
"license": "ISC",
"dependencies": {
"@babel/preset-stage-2": "^7.0.0",
"babel-preset-stage-2": "^6.24.1",
"body-parser": "^1.18.3",
"express": "^4.16.4",
"express-graphql": "^0.7.1",
"graphql": "^14.0.2",
"mongoose": "^5.4.1"
},
"devDependencies": {
"@babel/cli": "^7.2.3",
"@babel/core": "^7.2.2",
"@babel/plugin-proposal-object-rest-spread": "^7.2.0",
"@babel/preset-env": "^7.2.3",
"@babel/register": "^7.0.0",
"babel-cli": "^6.26.0",
"babel-plugin-transform-es2015-destructuring": "^6.23.0",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"nodemon": "^1.18.9"
}
}
node.js webstorm babel
asked Jan 3 at 16:29
Shan-DesaiShan-Desai
9501139
add a comment |
Webstorm / OS
Webstorm 2018.3/Windows 10
Node/NPM
v8.0.0/6.4.1
Steps followed
JetBrains ECMAScript6 in Webstorm Babel FileWatcher
I added
Babelthrough the steps
For a local repository I installed
npm i --save-dev @babel/cli @babel/core @babel/preset-env @babel/plugin-object-proposed-rest-spread
added
.babelrcin the root folder with following:
{
"presets": ["@babel/preset-env"],
"plugins": ["@babel/plugin-proposal-object-rest-spread"]
}
Configured my Run Configuration for
npm startsince mypackage.jsonhas"start": nodemon app.jsin it.
Application
I am using mongoose to store and obtain information from MongoDB and using GraphQL to provide an endpoint for queries/mutation
here is one of my mutation (function) within my code:
createEvent: (args) => {
const event = new Event({
title: args.eventInput.title,
description: args.eventInput.description,
price: +args.eventInput.price,
date: new Date(args.eventInput.date)
});
return event
.save()
.then(result => {
console.log(result);
return { ...result._doc };
})
.catch(err => {
console.log(err);
throw err;
});
}
Error:
SyntaxError: Unexpected token ...
Steps Followed Again
According to SE Query to Configure Babel with Webstorm for node.js project I tried creating a node.js app but I now get an Error:
Error: querySrv ENOTFOUND _mongodb._tcp.undefined-p8e7q.mongodb.net
at errnoException (dns.js:50:10)
at QueryReqWrap.onresolve [as oncomplete] (dns.js:244:19)
code: 'ENOTFOUND',
errno: 'ENOTFOUND',
syscall: 'querySrv',
hostname: '_mongodb._tcp.undefined-p8e7q.mongodb.net'
I now instead replace { ...result._doc } with return result._doc and the code works fine but I wish to use the spread operator within other blocks of code.
I understand that the error has nothing to do with Webstorm but I do not see any other alternative to this problem
Edit
File Watcher Babel
NPM Configuration
Node.js Configuration
created by right-click on app.js file and Create 'app.js' from menu. I installed npm i --save-dev @babel/register and changed it to -r @babel/register as mentioned in the blog
app.js
const express = require('express'); // Add Express Module
const bodyParser = require('body-parser'); // Add Body-Parser Middleware for JSON handling in Requests
const graphqlHttp = require('express-graphql'); // Add Middleware for GraphQL Resolvers over Express HTTP
const { buildSchema } = require('graphql'); // Javascript Object-Destructuring (pull objects from packages)
const mongoose = require('mongoose'); // MongoDB Third-Party package
const Event = require('./models/event'); // MongoDB Event Model
const app = express();
app.use(bodyParser.json()); // JSON parsing Middleware added
app.use('/graphql', graphqlHttp({
schema: buildSchema(`
type Event {
_id: ID!
title: String!
description: String!
price: Float!
date: String!
}
input EventInput {
title: String!
description: String!
price: Float!
date: String!
}
type RootQuery {
events: [Event!]!
}
type RootMutation {
createEvent(eventInput: EventInput): Event
}
schema {
query: RootQuery
mutation: RootMutation
}
`),
rootValue: {
events: () => {
return Event.find()
.then(events => {
return events.map( event => {
event._doc._id = event.id;
return event._doc;
});
})
.catch(err => {
console.log(err);
throw err;
})
},
createEvent: (args) => {
const event = new Event({
title: args.eventInput.title,
description: args.eventInput.description,
price: +args.eventInput.price,
date: new Date(args.eventInput.date)
});
return event
.save()
.then(result => {
console.log(result);
return { ...result._doc };
// return result._doc
})
.catch(err => {
console.log(err);
throw err;
});
}
},
graphiql: true
}));
mongoose.connect(
`mongodb+srv://${process.env.MONGO_USER}:${process.env.MONGO_PASSWORD}@${process.env.MONGO_CLUSTER_NAME}-p8e7q.mongodb.net/${process.env.MONGO_DB_NAME}?retryWrites=true`)
.then( () => {
app.listen(3000);
}).catch(err => {
console.log(err);
});
package.json
I added some weird babel packages as some desperate attempt to get it up and running which is in dev-dependencies
{
"name": "graphql-express-app",
"version": "0.0.4",
"description": "Academind's YouTube Series on GraphQL-Express-React",
"main": "app.js",
"scripts": {
"test": "echo "Error: no test specified" && exit 1",
"start": "nodemon app.js"
},
"keywords": [
"graphql",
"express",
"node.js"
],
"author": "",
"license": "ISC",
"dependencies": {
"@babel/preset-stage-2": "^7.0.0",
"babel-preset-stage-2": "^6.24.1",
"body-parser": "^1.18.3",
"express": "^4.16.4",
"express-graphql": "^0.7.1",
"graphql": "^14.0.2",
"mongoose": "^5.4.1"
},
"devDependencies": {
"@babel/cli": "^7.2.3",
"@babel/core": "^7.2.2",
"@babel/plugin-proposal-object-rest-spread": "^7.2.0",
"@babel/preset-env": "^7.2.3",
"@babel/register": "^7.0.0",
"babel-cli": "^6.26.0",
"babel-plugin-transform-es2015-destructuring": "^6.23.0",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"nodemon": "^1.18.9"
}
}
node.js webstorm babel
asked Jan 3 at 16:29
Shan-DesaiShan-Desai
9501139
Do you compile your code with babel (using file watcher) prior to passing it to node.js? if yes, what does your file watcher look like? what isapp.js- your original source file, or a file generated by Babel (via file watcher)?
– lena
Jan 3 at 18:11
I will update the question with more details via snapshots.
– Shan-Desai
Jan 3 at 19:09
@lena already updated the query with more information from the IDE and related files.
– Shan-Desai
Jan 3 at 20:22
I actually started with simplenpm startconfiguration and once I wrote the...operator in the code I got some problem and then I went ahead and did all the configuration mentioned above.
– Shan-Desai
Jan 3 at 20:45
add a comment |
Webstorm / OS
Webstorm 2018.3/Windows 10
Node/NPM
v8.0.0/6.4.1
Steps followed
JetBrains ECMAScript6 in Webstorm Babel FileWatcher
I added
Babelthrough the steps
For a local repository I installed
npm i --save-dev @babel/cli @babel/core @babel/preset-env @babel/plugin-object-proposed-rest-spread
added
.babelrcin the root folder with following:
{
"presets": ["@babel/preset-env"],
"plugins": ["@babel/plugin-proposal-object-rest-spread"]
}
Configured my Run Configuration for
npm startsince mypackage.jsonhas"start": nodemon app.jsin it.
Application
I am using mongoose to store and obtain information from MongoDB and using GraphQL to provide an endpoint for queries/mutation
here is one of my mutation (function) within my code:
createEvent: (args) => {
const event = new Event({
title: args.eventInput.title,
description: args.eventInput.description,
price: +args.eventInput.price,
date: new Date(args.eventInput.date)
});
return event
.save()
.then(result => {
console.log(result);
return { ...result._doc };
})
.catch(err => {
console.log(err);
throw err;
});
}
Error:
SyntaxError: Unexpected token ...
Steps Followed Again
According to SE Query to Configure Babel with Webstorm for node.js project I tried creating a node.js app but I now get an Error:
Error: querySrv ENOTFOUND _mongodb._tcp.undefined-p8e7q.mongodb.net
at errnoException (dns.js:50:10)
at QueryReqWrap.onresolve [as oncomplete] (dns.js:244:19)
code: 'ENOTFOUND',
errno: 'ENOTFOUND',
syscall: 'querySrv',
hostname: '_mongodb._tcp.undefined-p8e7q.mongodb.net'
I now instead replace { ...result._doc } with return result._doc and the code works fine but I wish to use the spread operator within other blocks of code.
I understand that the error has nothing to do with Webstorm but I do not see any other alternative to this problem
Edit
File Watcher Babel
NPM Configuration
Node.js Configuration
created by right-click on app.js file and Create 'app.js' from menu. I installed npm i --save-dev @babel/register and changed it to -r @babel/register as mentioned in the blog
app.js
const express = require('express'); // Add Express Module
const bodyParser = require('body-parser'); // Add Body-Parser Middleware for JSON handling in Requests
const graphqlHttp = require('express-graphql'); // Add Middleware for GraphQL Resolvers over Express HTTP
const { buildSchema } = require('graphql'); // Javascript Object-Destructuring (pull objects from packages)
const mongoose = require('mongoose'); // MongoDB Third-Party package
const Event = require('./models/event'); // MongoDB Event Model
const app = express();
app.use(bodyParser.json()); // JSON parsing Middleware added
app.use('/graphql', graphqlHttp({
schema: buildSchema(`
type Event {
_id: ID!
title: String!
description: String!
price: Float!
date: String!
}
input EventInput {
title: String!
description: String!
price: Float!
date: String!
}
type RootQuery {
events: [Event!]!
}
type RootMutation {
createEvent(eventInput: EventInput): Event
}
schema {
query: RootQuery
mutation: RootMutation
}
`),
rootValue: {
events: () => {
return Event.find()
.then(events => {
return events.map( event => {
event._doc._id = event.id;
return event._doc;
});
})
.catch(err => {
console.log(err);
throw err;
})
},
createEvent: (args) => {
const event = new Event({
title: args.eventInput.title,
description: args.eventInput.description,
price: +args.eventInput.price,
date: new Date(args.eventInput.date)
});
return event
.save()
.then(result => {
console.log(result);
return { ...result._doc };
// return result._doc
})
.catch(err => {
console.log(err);
throw err;
});
}
},
graphiql: true
}));
mongoose.connect(
`mongodb+srv://${process.env.MONGO_USER}:${process.env.MONGO_PASSWORD}@${process.env.MONGO_CLUSTER_NAME}-p8e7q.mongodb.net/${process.env.MONGO_DB_NAME}?retryWrites=true`)
.then( () => {
app.listen(3000);
}).catch(err => {
console.log(err);
});
package.json
I added some weird babel packages as some desperate attempt to get it up and running which is in dev-dependencies
{
"name": "graphql-express-app",
"version": "0.0.4",
"description": "Academind's YouTube Series on GraphQL-Express-React",
"main": "app.js",
"scripts": {
"test": "echo "Error: no test specified" && exit 1",
"start": "nodemon app.js"
},
"keywords": [
"graphql",
"express",
"node.js"
],
"author": "",
"license": "ISC",
"dependencies": {
"@babel/preset-stage-2": "^7.0.0",
"babel-preset-stage-2": "^6.24.1",
"body-parser": "^1.18.3",
"express": "^4.16.4",
"express-graphql": "^0.7.1",
"graphql": "^14.0.2",
"mongoose": "^5.4.1"
},
"devDependencies": {
"@babel/cli": "^7.2.3",
"@babel/core": "^7.2.2",
"@babel/plugin-proposal-object-rest-spread": "^7.2.0",
"@babel/preset-env": "^7.2.3",
"@babel/register": "^7.0.0",
"babel-cli": "^6.26.0",
"babel-plugin-transform-es2015-destructuring": "^6.23.0",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"nodemon": "^1.18.9"
}
}
node.js webstorm babel
asked Jan 3 at 16:29
Shan-DesaiShan-Desai
9501139
Webstorm / OS
Webstorm 2018.3/Windows 10
Node/NPM
v8.0.0/6.4.1
Steps followed
JetBrains ECMAScript6 in Webstorm Babel FileWatcher
I added
Babelthrough the steps
For a local repository I installed
npm i --save-dev @babel/cli @babel/core @babel/preset-env @babel/plugin-object-proposed-rest-spread
added
.babelrcin the root folder with following:
{
"presets": ["@babel/preset-env"],
"plugins": ["@babel/plugin-proposal-object-rest-spread"]
}
Configured my Run Configuration for
npm startsince mypackage.jsonhas"start": nodemon app.jsin it.
Application
I am using mongoose to store and obtain information from MongoDB and using GraphQL to provide an endpoint for queries/mutation
here is one of my mutation (function) within my code:
createEvent: (args) => {
const event = new Event({
title: args.eventInput.title,
description: args.eventInput.description,
price: +args.eventInput.price,
date: new Date(args.eventInput.date)
});
return event
.save()
.then(result => {
console.log(result);
return { ...result._doc };
})
.catch(err => {
console.log(err);
throw err;
});
}
Error:
SyntaxError: Unexpected token ...
Steps Followed Again
According to SE Query to Configure Babel with Webstorm for node.js project I tried creating a node.js app but I now get an Error:
Error: querySrv ENOTFOUND _mongodb._tcp.undefined-p8e7q.mongodb.net
at errnoException (dns.js:50:10)
at QueryReqWrap.onresolve [as oncomplete] (dns.js:244:19)
code: 'ENOTFOUND',
errno: 'ENOTFOUND',
syscall: 'querySrv',
hostname: '_mongodb._tcp.undefined-p8e7q.mongodb.net'
I now instead replace { ...result._doc } with return result._doc and the code works fine but I wish to use the spread operator within other blocks of code.
I understand that the error has nothing to do with Webstorm but I do not see any other alternative to this problem
Edit
File Watcher Babel
NPM Configuration
Node.js Configuration
created by right-click on app.js file and Create 'app.js' from menu. I installed npm i --save-dev @babel/register and changed it to -r @babel/register as mentioned in the blog
app.js
const express = require('express'); // Add Express Module
const bodyParser = require('body-parser'); // Add Body-Parser Middleware for JSON handling in Requests
const graphqlHttp = require('express-graphql'); // Add Middleware for GraphQL Resolvers over Express HTTP
const { buildSchema } = require('graphql'); // Javascript Object-Destructuring (pull objects from packages)
const mongoose = require('mongoose'); // MongoDB Third-Party package
const Event = require('./models/event'); // MongoDB Event Model
const app = express();
app.use(bodyParser.json()); // JSON parsing Middleware added
app.use('/graphql', graphqlHttp({
schema: buildSchema(`
type Event {
_id: ID!
title: String!
description: String!
price: Float!
date: String!
}
input EventInput {
title: String!
description: String!
price: Float!
date: String!
}
type RootQuery {
events: [Event!]!
}
type RootMutation {
createEvent(eventInput: EventInput): Event
}
schema {
query: RootQuery
mutation: RootMutation
}
`),
rootValue: {
events: () => {
return Event.find()
.then(events => {
return events.map( event => {
event._doc._id = event.id;
return event._doc;
});
})
.catch(err => {
console.log(err);
throw err;
})
},
createEvent: (args) => {
const event = new Event({
title: args.eventInput.title,
description: args.eventInput.description,
price: +args.eventInput.price,
date: new Date(args.eventInput.date)
});
return event
.save()
.then(result => {
console.log(result);
return { ...result._doc };
// return result._doc
})
.catch(err => {
console.log(err);
throw err;
});
}
},
graphiql: true
}));
mongoose.connect(
`mongodb+srv://${process.env.MONGO_USER}:${process.env.MONGO_PASSWORD}@${process.env.MONGO_CLUSTER_NAME}-p8e7q.mongodb.net/${process.env.MONGO_DB_NAME}?retryWrites=true`)
.then( () => {
app.listen(3000);
}).catch(err => {
console.log(err);
});
package.json
I added some weird babel packages as some desperate attempt to get it up and running which is in dev-dependencies
{
"name": "graphql-express-app",
"version": "0.0.4",
"description": "Academind's YouTube Series on GraphQL-Express-React",
"main": "app.js",
"scripts": {
"test": "echo "Error: no test specified" && exit 1",
"start": "nodemon app.js"
},
"keywords": [
"graphql",
"express",
"node.js"
],
"author": "",
"license": "ISC",
"dependencies": {
"@babel/preset-stage-2": "^7.0.0",
"babel-preset-stage-2": "^6.24.1",
"body-parser": "^1.18.3",
"express": "^4.16.4",
"express-graphql": "^0.7.1",
"graphql": "^14.0.2",
"mongoose": "^5.4.1"
},
"devDependencies": {
"@babel/cli": "^7.2.3",
"@babel/core": "^7.2.2",
"@babel/plugin-proposal-object-rest-spread": "^7.2.0",
"@babel/preset-env": "^7.2.3",
"@babel/register": "^7.0.0",
"babel-cli": "^6.26.0",
"babel-plugin-transform-es2015-destructuring": "^6.23.0",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"nodemon": "^1.18.9"
}
}
node.js webstorm babel
node.js webstorm babel
asked Jan 3 at 16:29
Shan-DesaiShan-Desai
9501139
asked Jan 3 at 16:29
Shan-DesaiShan-Desai
9501139
edited Jan 3 at 20:21
Shan-Desai
asked Jan 3 at 16:29
Shan-DesaiShan-Desai
9501139
asked Jan 3 at 16:29
Shan-DesaiShan-Desai
9501139
asked Jan 3 at 16:29
Shan-DesaiShan-Desai
9501139
9501139
Do you compile your code with babel (using file watcher) prior to passing it to node.js? if yes, what does your file watcher look like? what isapp.js- your original source file, or a file generated by Babel (via file watcher)?
– lena
Jan 3 at 18:11
I will update the question with more details via snapshots.
– Shan-Desai
Jan 3 at 19:09
@lena already updated the query with more information from the IDE and related files.
– Shan-Desai
Jan 3 at 20:22
I actually started with simplenpm startconfiguration and once I wrote the...operator in the code I got some problem and then I went ahead and did all the configuration mentioned above.
– Shan-Desai
Jan 3 at 20:45
add a comment |
Do you compile your code with babel (using file watcher) prior to passing it to node.js? if yes, what does your file watcher look like? what isapp.js- your original source file, or a file generated by Babel (via file watcher)?
– lena
Jan 3 at 18:11
I will update the question with more details via snapshots.
– Shan-Desai
Jan 3 at 19:09
@lena already updated the query with more information from the IDE and related files.
– Shan-Desai
Jan 3 at 20:22
I actually started with simplenpm startconfiguration and once I wrote the...operator in the code I got some problem and then I went ahead and did all the configuration mentioned above.
– Shan-Desai
Jan 3 at 20:45
Do you compile your code with babel (using file watcher) prior to passing it to node.js? if yes, what does your file watcher look like? what is
app.js - your original source file, or a file generated by Babel (via file watcher)?– lena
Jan 3 at 18:11
Do you compile your code with babel (using file watcher) prior to passing it to node.js? if yes, what does your file watcher look like? what is
app.js - your original source file, or a file generated by Babel (via file watcher)?– lena
Jan 3 at 18:11
I will update the question with more details via snapshots.
– Shan-Desai
Jan 3 at 19:09
I will update the question with more details via snapshots.
– Shan-Desai
Jan 3 at 19:09
@lena already updated the query with more information from the IDE and related files.
– Shan-Desai
Jan 3 at 20:22
@lena already updated the query with more information from the IDE and related files.
– Shan-Desai
Jan 3 at 20:22
I actually started with simple
npm start configuration and once I wrote the ... operator in the code I got some problem and then I went ahead and did all the configuration mentioned above.– Shan-Desai
Jan 3 at 20:45
I actually started with simple
npm start configuration and once I wrote the ... operator in the code I got some problem and then I went ahead and did all the configuration mentioned above.– Shan-Desai
Jan 3 at 20:45
add a comment |
1 Answer
1
active
oldest
votes
I stripped down your example and added a minimal version of what you need to get it up and running.
Basically what you're missing is the part where babel actually goes and transpiles your code. I don't know if webstorm does that for you, I'm using VS code.
.babelrc:
{
"presets": ["@babel/preset-env"],
"plugins": ["@babel/plugin-proposal-object-rest-spread"]
}
package.json (deps and scripts only, rest ommited):
"scripts": {
"test": "echo "Error: no test specified" && exit 1",
"start": "nodemon --exec babel-node app.js"
},
"devDependencies": {
"@babel/core": "^7.2.2",
"@babel/node": "^7.2.2",
"@babel/plugin-proposal-object-rest-spread": "^7.2.0",
"@babel/preset-env": "^7.2.3",
"nodemon": "^1.18.9"
}
Minimal app.js:
const o = {
a: 'a',
b: 'b',
};
const o2 = { ...o };
console.log(o2);
// Outputs: { a: 'a', b: 'b' }
You can save yourself from having to transpile nodejs code by using a recent version. The spread operator is supported in node from version 8.6.0 up: https://node.green/#ES2018-features-object-rest-spread-properties
Hope that helps!
answered Jan 3 at 23:33
FredFred
3,08411425
Thanks a ton! I managed to take into consideration both your suggestions. Updatednode v8.0.0 -> 10.5.0and your setting for babel.
– Shan-Desai
Jan 5 at 13:25
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54026224%2fspread-operator-throws-syntaxerror-even-after-babel-configuration-in-webstorm-20%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
I stripped down your example and added a minimal version of what you need to get it up and running.
Basically what you're missing is the part where babel actually goes and transpiles your code. I don't know if webstorm does that for you, I'm using VS code.
.babelrc:
{
"presets": ["@babel/preset-env"],
"plugins": ["@babel/plugin-proposal-object-rest-spread"]
}
package.json (deps and scripts only, rest ommited):
"scripts": {
"test": "echo "Error: no test specified" && exit 1",
"start": "nodemon --exec babel-node app.js"
},
"devDependencies": {
"@babel/core": "^7.2.2",
"@babel/node": "^7.2.2",
"@babel/plugin-proposal-object-rest-spread": "^7.2.0",
"@babel/preset-env": "^7.2.3",
"nodemon": "^1.18.9"
}
Minimal app.js:
const o = {
a: 'a',
b: 'b',
};
const o2 = { ...o };
console.log(o2);
// Outputs: { a: 'a', b: 'b' }
You can save yourself from having to transpile nodejs code by using a recent version. The spread operator is supported in node from version 8.6.0 up: https://node.green/#ES2018-features-object-rest-spread-properties
Hope that helps!
answered Jan 3 at 23:33
FredFred
3,08411425
Thanks a ton! I managed to take into consideration both your suggestions. Updatednode v8.0.0 -> 10.5.0and your setting for babel.
– Shan-Desai
Jan 5 at 13:25
add a comment |
I stripped down your example and added a minimal version of what you need to get it up and running.
Basically what you're missing is the part where babel actually goes and transpiles your code. I don't know if webstorm does that for you, I'm using VS code.
.babelrc:
{
"presets": ["@babel/preset-env"],
"plugins": ["@babel/plugin-proposal-object-rest-spread"]
}
package.json (deps and scripts only, rest ommited):
"scripts": {
"test": "echo "Error: no test specified" && exit 1",
"start": "nodemon --exec babel-node app.js"
},
"devDependencies": {
"@babel/core": "^7.2.2",
"@babel/node": "^7.2.2",
"@babel/plugin-proposal-object-rest-spread": "^7.2.0",
"@babel/preset-env": "^7.2.3",
"nodemon": "^1.18.9"
}
Minimal app.js:
const o = {
a: 'a',
b: 'b',
};
const o2 = { ...o };
console.log(o2);
// Outputs: { a: 'a', b: 'b' }
You can save yourself from having to transpile nodejs code by using a recent version. The spread operator is supported in node from version 8.6.0 up: https://node.green/#ES2018-features-object-rest-spread-properties
Hope that helps!
answered Jan 3 at 23:33
FredFred
3,08411425
Thanks a ton! I managed to take into consideration both your suggestions. Updatednode v8.0.0 -> 10.5.0and your setting for babel.
– Shan-Desai
Jan 5 at 13:25
add a comment |
I stripped down your example and added a minimal version of what you need to get it up and running.
Basically what you're missing is the part where babel actually goes and transpiles your code. I don't know if webstorm does that for you, I'm using VS code.
.babelrc:
{
"presets": ["@babel/preset-env"],
"plugins": ["@babel/plugin-proposal-object-rest-spread"]
}
package.json (deps and scripts only, rest ommited):
"scripts": {
"test": "echo "Error: no test specified" && exit 1",
"start": "nodemon --exec babel-node app.js"
},
"devDependencies": {
"@babel/core": "^7.2.2",
"@babel/node": "^7.2.2",
"@babel/plugin-proposal-object-rest-spread": "^7.2.0",
"@babel/preset-env": "^7.2.3",
"nodemon": "^1.18.9"
}
Minimal app.js:
const o = {
a: 'a',
b: 'b',
};
const o2 = { ...o };
console.log(o2);
// Outputs: { a: 'a', b: 'b' }
You can save yourself from having to transpile nodejs code by using a recent version. The spread operator is supported in node from version 8.6.0 up: https://node.green/#ES2018-features-object-rest-spread-properties
Hope that helps!
answered Jan 3 at 23:33
FredFred
3,08411425
I stripped down your example and added a minimal version of what you need to get it up and running.
Basically what you're missing is the part where babel actually goes and transpiles your code. I don't know if webstorm does that for you, I'm using VS code.
.babelrc:
{
"presets": ["@babel/preset-env"],
"plugins": ["@babel/plugin-proposal-object-rest-spread"]
}
package.json (deps and scripts only, rest ommited):
"scripts": {
"test": "echo "Error: no test specified" && exit 1",
"start": "nodemon --exec babel-node app.js"
},
"devDependencies": {
"@babel/core": "^7.2.2",
"@babel/node": "^7.2.2",
"@babel/plugin-proposal-object-rest-spread": "^7.2.0",
"@babel/preset-env": "^7.2.3",
"nodemon": "^1.18.9"
}
Minimal app.js:
const o = {
a: 'a',
b: 'b',
};
const o2 = { ...o };
console.log(o2);
// Outputs: { a: 'a', b: 'b' }
You can save yourself from having to transpile nodejs code by using a recent version. The spread operator is supported in node from version 8.6.0 up: https://node.green/#ES2018-features-object-rest-spread-properties
Hope that helps!
answered Jan 3 at 23:33
FredFred
3,08411425
edited Jan 3 at 23:40
answered Jan 3 at 23:33
FredFred
3,08411425
answered Jan 3 at 23:33
FredFred
3,08411425
answered Jan 3 at 23:33
FredFred
3,08411425
3,08411425
Thanks a ton! I managed to take into consideration both your suggestions. Updatednode v8.0.0 -> 10.5.0and your setting for babel.
– Shan-Desai
Jan 5 at 13:25
add a comment |
Thanks a ton! I managed to take into consideration both your suggestions. Updatednode v8.0.0 -> 10.5.0and your setting for babel.
– Shan-Desai
Jan 5 at 13:25
Thanks a ton! I managed to take into consideration both your suggestions. Updated
node v8.0.0 -> 10.5.0 and your setting for babel.– Shan-Desai
Jan 5 at 13:25
Thanks a ton! I managed to take into consideration both your suggestions. Updated
node v8.0.0 -> 10.5.0 and your setting for babel.– Shan-Desai
Jan 5 at 13:25
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54026224%2fspread-operator-throws-syntaxerror-even-after-babel-configuration-in-webstorm-20%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Do you compile your code with babel (using file watcher) prior to passing it to node.js? if yes, what does your file watcher look like? what is
app.js- your original source file, or a file generated by Babel (via file watcher)?– lena
Jan 3 at 18:11
I will update the question with more details via snapshots.
– Shan-Desai
Jan 3 at 19:09
@lena already updated the query with more information from the IDE and related files.
– Shan-Desai
Jan 3 at 20:22
I actually started with simple
npm startconfiguration and once I wrote the...operator in the code I got some problem and then I went ahead and did all the configuration mentioned above.– Shan-Desai
Jan 3 at 20:45