text: /* Base config:
    ========================================================================== */
  
  const path = require('path')
  const fs = require('fs')
  const MiniCssExtractPlugin = require('mini-css-extract-plugin')
  const CopyWebpackPlugin = require('copy-webpack-plugin')
  const HtmlWebpackPlugin = require('html-webpack-plugin')
  const { VueLoaderPlugin } = require('vue-loader')
  
  // Main const
  const PATHS = {
    src: path.join(__dirname, '../src'),
    dist: path.join(__dirname, '../dist'),
    assets: 'assets/'
  }
  
  // Pages const for HtmlWebpackPlugin
  // see more: https://github.com/vedees/webpack-template/blob/master/README.md#html-dir-folder
  const PAGES_DIR = PATHS.src
  const PAGES = fs
    .readdirSync(`${PAGES_DIR}/pug/pages`).filter(fileName => fileName.endsWith('.pug'))
  
  module.exports = {
    externals: {
      paths: PATHS
    },
    entry: {
      app: PATHS.src
      // module: `${PATHS.src}/your-module.js`,
    },
    output: {
      filename: `${PATHS.assets}js/[name].[contenthash].js`,
      path: PATHS.dist,
      /*
        publicPath: '/' - relative path for dist folder (js,css etc)
        publicPath: './' (dot before /) - absolute path for dist folder (js,css etc)
      */
      publicPath: ''
    },
    optimization: {
      splitChunks: {
        cacheGroups: {
          vendor: {
            name: 'vendors',
            test: /node_modules/,
            chunks: 'all',
            enforce: true
          }
        }
      }
    },
    module: {
      rules: [
        {
          // pug
          test: /\.pug$/,
          loader: 'pug-loader'
        },
        {
          // JavaScript
          test: /\.js$/,
          loader: 'babel-loader',
          exclude: '/node_modules/'
        },
        {
          // Vue
          test: /\.vue$/,
          loader: 'vue-loader',
          options: {
            loader: {
              scss: 'vue-style-loader!css-loader!sass-loader'
            }
          }
        },
        {
          // Fonts
          test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
          loader: 'file-loader',
          options: {
            name: '[name].[ext]'
          }
        },
        {
          // images / icons
          test: /\.(png|jpg|gif|svg)$/,
          loader: 'file-loader',
          options: {
            name: '[name].[ext]'
          }
        },
        {
          // scss
          test: /\.scss$/,
          use: [
            'style-loader',
            MiniCssExtractPlugin.loader,
            {
              loader: 'css-loader',
              options: { sourceMap: true }
            },
            {
              loader: 'postcss-loader',
              options: {
                sourceMap: true,
                config: { path: `./postcss.config.js` }
              }
            },
            {
              loader: 'sass-loader',
              options: { sourceMap: true }
            }
          ]
        },
        {
          // css
          test: /\.css$/,
          use: [
            'style-loader',
            MiniCssExtractPlugin.loader,
            {
              loader: 'css-loader',
              options: { sourceMap: true }
            },
            {
              loader: 'postcss-loader',
              options: {
                sourceMap: true,
                config: { path: `./postcss.config.js` }
              }
            }
          ]
        }
      ]
    },
    resolve: {
      alias: {
        '~': PATHS.src, // Example: import Dog from "~/assets/img/dog.jpg"
        '@': `${PATHS.src}/js`, // Example: import Sort from "@/utils/sort.js"
        vue$: 'vue/dist/vue.js'
      }
    },
    plugins: [
      // Vue loader
      new VueLoaderPlugin(),
      new MiniCssExtractPlugin({
        filename: `assets/css/app.6c2bf4c214272c252122.css`
      }),
      new CopyWebpackPlugin({
        patterns: [
          // Images:
          {
            from: `${PATHS.src}/${PATHS.assets}img`,
            to: `${PATHS.assets}img`
          },
          // Fonts:
          {
            from: `${PATHS.src}/${PATHS.assets}fonts`,
            to: `${PATHS.assets}fonts`
          },
          // Static (copy to '/'):
          {
            from: `${PATHS.src}/static`,
            to: ''
          }
        ]
      }),
  
      /*
        Automatic creation any html pages (Don't forget to RERUN dev server!)
        See more:
        https://github.com/vedees/webpack-template/blob/master/README.md#create-another-html-files
        Best way to create pages:
        https://github.com/vedees/webpack-template/blob/master/README.md#third-method-best
      */
      ...PAGES.map(
        page =>
          new HtmlWebpackPlugin({
            template: `${PAGES_DIR}/pug/pages/${page}`,
            filename: `./${page.replace(/\.pug/, '.html')}`
          })
      )
    ]
  }
  