Webpack 4 - Preact

This boilerplate for webpack 4 is designed to work with preact.
However, you can modify this boilerplate as you want (e.g. to use it with Vue )

Javascript :

All the javascript files are transpiled with babel and use sourcemaps (in developpment) for a better and easier debugging (what you see in the devtools is the original file and not the transpiled one)

In case you want more informations about devtools : https://webpack.js.org/configuration/devtool/

Feel free to use your owns in the config.js file.

Styles :

You can work with .scss files.
dev : css is automatically inlined in the index.html.
prod : css is extracted in its own .css file.

Config :

module.exports = {
    port: {
        front: 3000, // port for devServer
    },
    entry: {
        front: [path.resolve(__dirname, 'front/static/js/components/app.js')], // entrypoint for front js file
    },
    devtool: production ? false : 'eval-cheap-module-source-map',
    componentsPath: path.resolve(__dirname, 'src/components'), // path for components (aliases)
    routesPath: path.resolve(__dirname, 'src/routes'),
    staticPath: path.resolve(__dirname, 'src'), // path for static files (aliases)
    template: './src/index.html' // path of template
}