Babel config in a MERN app

I have given up at trying to learn rails. I'm now focusing my energy on trying to get started with node, using the MERN stack. I have done both Stephen Grider and Andrew Mead's udemy course as well as all of the code school js courses. I'm afraid I'm not off to a promising start.

I'm stuck at getting my import statements to work. So far, I have tried to import files. For that I need babel. My package.json has:

"scripts": {
    "test": "mocha test/**/*-test.js --compilers js:babel-core/register --recursive",
    "start": "nodemon -w server.js server.js  --source-maps"
  },
  "author": "Ol",
  "license": "MIT",
  "dependencies": {
    "axios": "^0.16.1",
    "babel-cli": "^6.24.1",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babel-polyfill": "^6.13.0",
    "body-parser": "^1.17.1",
    "caniuse-api": "^2.0.0",
    "express": "^4.13.4",
    "lodash": "^4.17.4",
    "material-ui": "^0.18.0",
    "nodemon": "^1.11.0",
    "react": "^15.5.4",
    "react-dom": "^15.5.4",
    "react-promise": "^1.1.2",
    "react-redux": "^5.0.4",
    "react-router": "^4.1.1",
    "react-tap-event-plugin": "^2.0.1",
    "redux": "^3.6.0",
    "redux-devtools": "^3.4.0",
    "redux-form": "^6.7.0",
    "redux-thunk": "^2.2.0",
    "socket.io": "^2.0.1",
    "source-map-support": "^0.4.15"
  },
  "devDependencies": {
    "babel": "^6.23.0",
    "babel-core": "^6.24.1",
    "babel-loader": "^7.0.0",
    "babelify": "^7.3.0",
    "enzyme": "^2.8.2",
    "mocha": "^3.3.0",
    "react-addons-test-utils": "^15.5.1",
    "webpack": "^2.5.1"
  }
}

My .babelrc has:

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

My server.js has:

import express from 'express';
import bodyParser from 'body-parser';
import { MongoClient } from 'mongodb';
import 'babel-polyfill';
import SourceMapSupport from 'source-map-support';


SourceMapSupport.install(); //to get line numbers with file refs rather than compiled code line numbers


// const app = express();

app.use(express.static('open'));
app.use(bodyParser.json());

app.listen(3000, function(){
  console.log('listening on 3000');
});

My webpack.config.js has:

module :{
    rules:[{
      // use : 'babel-loader',
      loader: 'babel-loader',
      query :{
        presets:['react','es2015']
        // ,'es2017'
      },
      test: /\.jsx?$/,
      exclude: /(node_modules|bower_components)/
    }]

When I try to use npm start, I get an error with my import statements. It says:

{ import express from 'express';
                                                              ^^^^^^
SyntaxError: Unexpected token import
    at createScript (vm.js:56:10)
    at Object.runInThisContext (vm.js:97:10)
    at Module._compile (module.js:542:28)
    at Object.Module._extensions..js (module.js:579:10)
    at Module.load (module.js:487:32)
    at tryModuleLoad (module.js:446:12)
    at Function.Module._load (module.js:438:3)
    at Module.runMain (module.js:604:10)
    at run (bootstrap_node.js:390:7)
    at startup (bootstrap_node.js:150:9)
[nodemon] app crashed - waiting for file changes before starting...

Can anyone give me a clue on how to get babel setup to work with a node app. I noticed that even when I run npm install in my console, I don't get a node_modules folder in my app. I used yarn to add dependencies to package.json, but don't seem to have the ability to generate an node_modules folder.

via Mel