github.com/JarrahG/buffalocli@v0.0.0-20230801092127-b85bfd5d395a/internal/genny/assets/webpack/templates/webpack.config.js.tmpl (about)

     1  const Webpack = require("webpack");
     2  const Glob = require("glob");
     3  const CopyWebpackPlugin = require("copy-webpack-plugin");
     4  const MiniCssExtractPlugin = require("mini-css-extract-plugin");
     5  const { WebpackManifestPlugin } = require("webpack-manifest-plugin");
     6  const TerserPlugin = require("terser-webpack-plugin");
     7  const LiveReloadPlugin = require("webpack-livereload-plugin");
     8  
     9  const configurator = {
    10    entries: function(){
    11      var entries = {
    12        application: [
    13          './assets/css/application.scss',
    14        ],
    15      }
    16  
    17      Glob.sync("./assets/*/*.*").forEach((entry) => {
    18        if (entry === './assets/css/application.scss') {
    19          return
    20        }
    21  
    22        let key = entry.replace(/(\.\/assets\/(src|js|css|go)\/)|\.(ts|js|s[ac]ss|go)/g, '')
    23        if(key.startsWith("_") || (/(ts|js|s[ac]ss|go)$/i).test(entry) == false) {
    24          return
    25        }
    26  
    27        if( entries[key] == null) {
    28          entries[key] = [entry]
    29          return
    30        }
    31  
    32        entries[key].push(entry)
    33      })
    34      return entries
    35    },
    36  
    37    plugins() {
    38      var plugins = [
    39        new Webpack.ProvidePlugin({
    40          $: "jquery",
    41          jQuery: "jquery"
    42        }),
    43        new MiniCssExtractPlugin({filename: "[name].[contenthash].css"}),
    44        new CopyWebpackPlugin({
    45          patterns: [{
    46            from: "./assets",
    47            globOptions: {
    48              ignore: [
    49                "**/assets/css/**",
    50                "**/assets/js/**",
    51                "**/assets/src/**",
    52              ]
    53            }
    54          }],
    55        }),
    56        new Webpack.LoaderOptionsPlugin({minimize: true,debug: false}),
    57        new WebpackManifestPlugin({fileName: "manifest.json",publicPath: ""})
    58      ];
    59  
    60      return plugins
    61    },
    62  
    63    moduleOptions: function() {
    64      return {
    65        rules: [
    66          {
    67            test: /\.s[ac]ss$/,
    68            use: [
    69              MiniCssExtractPlugin.loader,
    70              { loader: "css-loader", options: {sourceMap: true}},
    71              { loader: "postcss-loader", options: {sourceMap: true}},
    72              { loader: "sass-loader", options: {sourceMap: true}}
    73            ]
    74          },
    75          { test: /\.tsx?$/, use: "ts-loader", exclude: /node_modules/},
    76          { test: /\.jsx?$/,loader: "babel-loader",exclude: /node_modules/ },
    77          { test: /\.(woff|woff2|ttf|svg)(\?v=\d+\.\d+\.\d+)?$/,use: "url-loader"},
    78          { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,use: "file-loader" },
    79          { test: /\.go$/, use: "gopherjs-loader"}
    80        ]
    81      }
    82    },
    83  
    84    buildConfig: function(){
    85      // NOTE: If you are having issues with this not being set "properly", make
    86      // sure your GO_ENV is set properly as `buffalo build` overrides NODE_ENV
    87      // with whatever GO_ENV is set to or "development".
    88      const env = process.env.NODE_ENV || "development";
    89  
    90      var config = {
    91        mode: env,
    92        entry: configurator.entries(),
    93        output: {
    94          filename: "[name].[contenthash].js",
    95          path: `${__dirname}/public/assets`,
    96          clean: true,
    97        },
    98        plugins: configurator.plugins(),
    99        module: configurator.moduleOptions(),
   100        resolve: {
   101          extensions: ['.ts', '.js', '.json']
   102        }
   103      }
   104  
   105      if( env === "development" ){
   106        config.plugins.push(new LiveReloadPlugin({appendScriptTag: true}))
   107        return config
   108      }
   109  
   110      const terser = new TerserPlugin({
   111        terserOptions: {
   112          compress: {},
   113          mangle: {
   114            keep_fnames: true
   115          },
   116          output: {
   117            comments: false,
   118          },
   119        },
   120        extractComments: false,
   121      })
   122  
   123      config.optimization = {
   124        minimizer: [terser]
   125      }
   126  
   127      return config
   128    }
   129  }
   130  
   131  module.exports = configurator.buildConfig()