Using Import In NodeJS server

Question

At the moment all my module in my nodejs server are imported as require() ie:

let path = require('path');
let express = require('express');
let http = require('http');
let app = express();

However the tutorial I am following shows them imported as:

import express from 'express'
import path from 'path'

Which throws the error:

SyntaxError: Unexpected token import

My webpack.config.js is set up as:

module: {
    rules: [
        {
            test: /\.js?$/,
            use: 'babel-loader',
            exclude: /node_modules/
        }
    ]
}

In bablerc:

{
  "presets": ["es2015", "react"]
}

My package versions:

   "babel-core": "^6.7.6",
    "babel-loader": "^6.2.4",
    "babel-preset-es2015": "^6.6.0",
    "babel-preset-react": "^6.5.0",

   "react": "^15.0.1",

  "devDependencies": {
    "babel-cli": "^6.18.0",
    "babel-preset-env": "0.0.3",
    "webpack": "^2.2.1",
    "webpack-dev-middleware": "^1.10.1",
    "webpack-dev-server": "^2.4.1",
    "webpack-hot-middleware": "^2.17.1"
  }

Import works in all my react components files, just not server.js. How do I switch my server over to Import from require?

Michel Kansou · Accepted Answer · 2018-02-23 14:53:40Z

20

It works in the webpack situation because the code is run through babel. You can run your node.js code through babel.

Install the babel cli if you don't have it

npm install --save-dev babel-cli

Then run your code like this:

./node_modules/.bin/babel-node server.js

Or put it in package.json.

{
  "scripts": {
    "start": "babel-node server.js"
  }
}

edited Feb 23, 2018 at 14:53

Michel Kansou

2,9714 gold badges15 silver badges22 bronze badges

answered Mar 7, 2017 at 10:21

Brigand

86.4k20 gold badges167 silver badges174 bronze badges

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

5 Comments

Mentor Over a year ago

From what I understand there is some discussion in the nodejs dev team about how to handle the import statement. It should be included in node at some point, but for now it's babel...

Brigand Over a year ago

It's going to be pretty different from the way babel does it. I'll probably continue using babel's implementation for the foreseeable future.

RegarBoy Over a year ago

Why do you install babel-cli to use babel-node? and your solution actually is not helping at all. Still the same error.

user7075574 Over a year ago

Now you can just place "type": "module" on you package JSON

jaibalaji Over a year ago

how to use babel-node command when we have nodemon ?

Renaat De Muynck · Accepted Answer · 2021-04-16 12:14:30Z

5

By default, you’ll be using ES5, and it’ll be required to use require to pull in modules. As we move forward with ES6 and beyond, it’s really best for us to start using ES6 classes as well as import and export statements. To do this, we’ll need Babel in order to interpret our ES6 syntax.

npm install --save-dev babel-cli
npm install --save-dev babel-preset-es2015
Let's pull in both babel-cli and babel preset es2015 as dev dependencies as well as add the .babelrc file:

{
  "presets": ["es2015"]
}

The issue should be gone, if you follow above steps

For more information please see: https://codebrains.io/setting-up-express-with-es6-and-babel/

edited Apr 16, 2021 at 12:14

Renaat De Muynck

3,3671 gold badge24 silver badges21 bronze badges

answered May 7, 2018 at 6:52

Dave Wang

1582 silver badges6 bronze badges

1 Comment

jaibalaji Over a year ago

any thoughts for nodemon ?

Muhammad Osama · Accepted Answer · 2022-03-11 12:14:47Z

3

Update 2022:

You can now use "type": "module" in your package.json file and this will enable the ES6 import. No extra installations needed.

{
  "name": "test",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",

  "type": "module", 

  ...
}

answered Mar 11, 2022 at 12:14

Muhammad Osama

1,0571 gold badge10 silver badges22 bronze badges

Collectives™ on Stack Overflow

Using Import In NodeJS server

3 Answers 3

5 Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

5 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related