Simple Webpack + Babel 7 Starter

Simple Webpack + Babel 7 Starter

Firstly, install the necessary packages:

yarn add -D webpack webpack-cli babel-loader @babel/core @babel/preset-env @babel/runtime @babel/plugin-transform-runtime # For Async/Await progress-bar-webpack-plugin # optional

And add a script to your package.json

{
    ...
    scripts: {
        "build": "NODE_ENV=production webpack",
            "watch": "NODE_ENV=development webpack --watch"
    }
    ...
}

Now create a .babelrc in your project root.

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "targets": {
          "node": true
        },
        "modules": "commonjs"
      }
    ]
  ],
  "plugins": [
    "@babel/transform-runtime"
  ]
}

And the base webpack.config.js config file:

const path = require('path')
const ProgressBarPlugin = require('progress-bar-webpack-plugin')

module.exports = {
    mode: 'production',
    entry: [
      './index.js'
    ],
    target: 'node',
    devtool: 'source-map',
    output: {
        path: path.resolve(__dirname, 'build'),
        filename: 'index.js'
    },
    module: {
        rules: [
            {
                use: 'babel-loader',
                exclude: /(node_modules)/,
                test: /\.js$/
            }
        ]
    },
    plugins: [
        new ProgressBarPlugin()
    ]
}

Alternatively, if you have multiple entrypoints (for example building multiple functions):

const path = require('path')
const ProgressBarPlugin = require('progress-bar-webpack-plugin')

module.exports = {
  mode: process.env.NODE_ENV,
  target: 'node',
    resolve: {
      alias: {
        '@': path.resolve(__dirname, 'src'),
        Utils: path.resolve(__dirname, 'src/utils')
      }
    },
  entry: {
    BuildFolder: './src/EntryFolder'
  },
  output: {
    path: __dirname,
    filename: '[name]/index.js',
    libraryTarget: 'commonjs'
  },
  module: {
    rules: [{
      use: ['babel-loader'],
      exclude: /(node_modules)/,
      test: /\.js$/
    }]
  },
  plugins: [new ProgressBarPlugin()]
}

Now go build great things!

Address

Address?
Not happening.
I get enough email spam as it is ¯\_(ツ)_/¯