NPM – Webpack Scripts

mkdir webpack-demo
cd webpack-demo
npm init -y
npm install webpack webpack-cli --save-dev

my-project/
├── assets/
│   └── js/
│       ├── polygon-intro.js
│       ├── polygon-intro.min.js (will be generated by Webpack)
│       └── index.html
├── bundler/
│   └── node_modules/
├── config/
│   └── webpack.config.js
├── package.json
└── .babelrc

webpack.config.js

const path = require('path');

module.exports = {
    entry: path.resolve(__dirname, '../assets/js/polygon-intro.js'),
    output: {
        filename: 'polygon-intro.min.js',
        path: path.resolve(__dirname, '../assets/js'),
        publicPath: '/',
    },
    resolve: {
        modules: [path.resolve(__dirname, '../node_modules'), 'node_modules']
    },
    module: {
        rules: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: ['@babel/preset-env'],
                    },
                },
            },
        ],
    },
    devServer: {
        static: {
            directory: path.resolve(__dirname, '../assets/js'),
        },
        compress: true,
        port: 9000,
        hot: true,
        open: true
    },
    mode: 'development',
};

.babelrc

{
    "presets": ["@babel/preset-env"]
}

npm start

npx webpack --mode production