How to run webpack config file written in ES6?

Question

JavaScript

webpack.config.js

import Config, { enviroment } from 'webpack-config';

enviroment.setAll({
  env: () => process.env.NODE_ENV
});

export default new Config().extend('config/webpack.[env].config.js');

package.json

"devDependencies": {
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babel-register": "^6.26.0",
    "html-webpack-plugin": "^2.30.1",
    "webpack": "^3.6.0",
    "webpack-config": "^7.4.0"
  },
  "scripts": {
    "build-dev": "set NODE_ENV=development && webpack --progress",
    "build-prod": "set NODE_ENV=production && webpack --progress"
  }

file structure:
webpack.config.js <-- (config/webpack.production.config.js || config/webpack.development.config.js) <-- config/webpack.base.config.js
they are all on ES6 I'm
running like this: npm run build- prod webpack.config.babel.js didn't help

Answer 1

I found a solution.
I added the line

alias: {
        jquery: require.resolve('jquery'),
      },

in the webpack.config.js settings in the resolve section
Full description of the resolve block

resolve: {
      modulesDirectories: ['node_modules'],
      extensions: ['.js', ''],
      alias: {
        jquery: require.resolve('jquery'),
      },
    },

Now the parroller.js plugin is easily connected via import
However, in order to call it on the element, I had to wrap it in $(document).ready

import 'paroller.js';

$(document).ready(() => {
  $('.js-box').paroller({
    factor: 0.5,
    factorXs: 0.2,
    type: 'foreground',
    direction: 'horizontal',
  });
});

Answer 2

The node does not know how to import yet. So either use modules that allow such code (and they exist), or use the usual require.

Answer 3

https://babeljs.io/docs/usage/babel-register/