text: const webpack = require('webpack');
  const HtmlWebpackPlugin = require('html-webpack-plugin');
  const MiniCssExtractPlugin = require('mini-css-extract-plugin');
  
  const path = require('path');
  
  function resolvePath(dir) {
    return path.join(__dirname, '..', dir);
  }
  
  const env = process.env.NODE_ENV || 'development';
  
  module.exports = {
    mode: env,
    entry: {
      app: './demo/svelte/main.js',
    },
    output: {
      path: resolvePath('demo/svelte/public'),
      hashDigestLength: 6,
      filename: 'js/[name].[hash].js',
      chunkFilename: 'js/[name].[chunkhash].js',
      publicPath: '/',
      hotUpdateChunkFilename: 'hot/hot-update.js',
      hotUpdateMainFilename: 'hot/hot-update.json',
    },
    resolve: {
      extensions: ['.mjs', '.js', '.svelte', '.json'],
      mainFields: ['svelte', 'browser', 'module', 'main'],
    },
    devtool: env === 'production' ? 'source-map' : 'eval',
    devServer: {
      hot: true,
      open: true,
      compress: true,
      contentBase: '/demo/svelte/public/',
      disableHostCheck: true,
      historyApiFallback: true,
      port: 8081,
      watchOptions: {
        poll: 1000,
      },
    },
    optimization: {
      splitChunks: {
        chunks: 'all',
      },
    },
    module: {
      rules: [
        {
          test: /\.(mjs|js|jsx)$/,
          use: {
            loader: 'babel-loader',
            options: {
              presets: [
                [
                  '@babel/preset-env',
                  {
                    modules: false,
                  },
                ],
              ],
              plugins: [
                '@babel/plugin-transform-runtime',
                '@babel/plugin-syntax-dynamic-import',
              ],
            },
          },
          include: [resolvePath('src'), resolvePath('demo')],
        },
        {
          test: /\.svelte$/,
          use: {
            loader: 'svelte-loader',
            options: {
              emitCss: true,
            },
          },
        },
        {
          test: /\.css$/,
          use: ['style-loader', 'css-loader', 'postcss-loader'],
        },
        {
          test: /\.(sa|sc)ss$/,
          use: ['style-loader', 'css-loader', 'postcss-loader', 'sass-loader'],
        },
        {
          test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
          loader: 'file-loader',
          options: {
            name: 'images/[name].[hash:6].[ext]',
          },
        },
        {
          test: /\.(mp4|webm|ogg|mp3|wav|flac|aac|m4a)(\?.*)?$/,
          loader: 'file-loader',
          options: {
            name: 'media/[name].[hash:6].[ext]',
          },
        },
        {
          test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
          loader: 'file-loader',
          options: {
            name: 'fonts/[name].[hash:6].[ext]',
          },
        },
      ],
    },
    plugins: [
      new webpack.DefinePlugin({
        'process.env.NODE_ENV': JSON.stringify(env),
      }),
      new webpack.optimize.ModuleConcatenationPlugin(),
      new webpack.HotModuleReplacementPlugin(),
      new MiniCssExtractPlugin({
        filename: 'css/[name].[hash].css',
        chunkFilename: 'css/[name].[chunkhash].css',
      }),
      new HtmlWebpackPlugin({
        filename: './index.html',
        template: './demo/svelte/index.html',
        inject: true,
        minify:
          env === 'production'
            ? {
                collapseWhitespace: true,
                removeComments: true,
                removeRedundantAttributes: true,
                removeScriptTypeAttributes: true,
                removeStyleLinkTypeAttributes: true,
                useShortDoctype: true,
              }
            : false,
      }),
    ],
  };
  