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