Update npm dependencies (also flake.lock: Update) (#532)

* flake.lock: Update

Flake lock file updates:

• Updated input 'flake-utils':
    'github:numtide/flake-utils/c0e246b9b83f637f4681389ecabcb2681b4f3af0' (2022-08-07)
  → 'github:numtide/flake-utils/6ee9ebb6b1ee695d2cacc4faa053a7b9baa76817' (2022-10-29)
• Updated input 'nixos-org-configurations':
    'github:NixOS/nixos-org-configurations/569797100aac69780a12542c2143bb741380d4ec' (2022-08-17)
  → 'github:NixOS/nixos-org-configurations/cebfd15c30724cadacf85b5fd950dc1070c4eb7d' (2022-10-26)
• Updated input 'nixpkgs':
    'github:NixOS/nixpkgs/f3d0897be466aa09a37f6bf59e62c360c3f9a6cc' (2022-08-25)
  → 'github:NixOS/nixpkgs/448a599c49978c2794401bfc3a2e1fba1a8663be' (2022-10-28)

* Switch from yarn to npm for frontend

also update all the npm dependencies

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Co-authored-by: Rok Garbas <rok@garbas.si>

.gitignore

@@ -14,7 +14,6 @@ ignore
 logs
 node_modules
 npm-debug.log*
-package-lock.json
 repl-temp-*
 result
 src-url

flake.lock

@@ -2,11 +2,11 @@
   "nodes": {
     "flake-utils": {
       "locked": {
-        "lastModified": 1659877975,
+        "lastModified": 1667395993,
-        "narHash": "sha256-zllb8aq3YO3h8B/U0/J1WBgAL8EX5yWf5pMj3G0NAmc=",
+        "narHash": "sha256-nuEHfE/LcWyuSWnS8t12N1wc105Qtau+/OdUAjtQ0rA=",
         "owner": "numtide",
         "repo": "flake-utils",
-        "rev": "c0e246b9b83f637f4681389ecabcb2681b4f3af0",
+        "rev": "5aed5285a952e0b949eb3ba02c12fa4fcfef535f",
         "type": "github"
       },
       "original": {
@@ -18,11 +18,11 @@
     "nixos-org-configurations": {
       "flake": false,
       "locked": {
-        "lastModified": 1660725019,
+        "lastModified": 1666806338,
-        "narHash": "sha256-729dr5TzCG3JIYgrcyyZQoG/e+Ugr6r2NB08Izer0q8=",
+        "narHash": "sha256-Q0uLdIJAMi1sC0bNOKoPJk39hMMkves1rtEsFDAZZ5o=",
         "owner": "NixOS",
         "repo": "nixos-org-configurations",
-        "rev": "569797100aac69780a12542c2143bb741380d4ec",
+        "rev": "cebfd15c30724cadacf85b5fd950dc1070c4eb7d",
         "type": "github"
       },
       "original": {
@@ -33,11 +33,11 @@
     },
     "nixpkgs": {
       "locked": {
-        "lastModified": 1661450036,
+        "lastModified": 1667231093,
-        "narHash": "sha256-0/9UyJLtfWqF4uvOrjFIzk8ue1YYUHa6JIhV0mALkH0=",
+        "narHash": "sha256-RERXruzBEBuf0c7OfZeX1hxEKB+PTCUNxWeB6C1jd8Y=",
         "owner": "NixOS",
         "repo": "nixpkgs",
-        "rev": "f3d0897be466aa09a37f6bf59e62c360c3f9a6cc",
+        "rev": "d40fea9aeb8840fea0d377baa4b38e39b9582458",
         "type": "github"
       },
       "original": {
@@ -46,11 +46,28 @@
         "type": "indirect"
       }
     },
+    "npmlock2nix": {
+      "flake": false,
+      "locked": {
+        "lastModified": 1666460237,
+        "narHash": "sha256-HME6rnysvCwUVtH+BDWDGahmweMaLgD2wqHeRuGp6QI=",
+        "owner": "nix-community",
+        "repo": "npmlock2nix",
+        "rev": "eeed152290ec2425f96c5e74e469c40b621e1468",
+        "type": "github"
+      },
+      "original": {
+        "owner": "nix-community",
+        "repo": "npmlock2nix",
+        "type": "github"
+      }
+    },
     "root": {
       "inputs": {
         "flake-utils": "flake-utils",
         "nixos-org-configurations": "nixos-org-configurations",
-        "nixpkgs": "nixpkgs"
+        "nixpkgs": "nixpkgs",
+        "npmlock2nix": "npmlock2nix"
       }
     }
   },

flake.nix

@@ -6,18 +6,28 @@
 
   inputs.nixpkgs.url = "nixpkgs/nixos-unstable";
   inputs.flake-utils.url = "github:numtide/flake-utils";
+  inputs.npmlock2nix.url = "github:nix-community/npmlock2nix";
+  inputs.npmlock2nix.flake = false;
   inputs.nixos-org-configurations.url = "github:NixOS/nixos-org-configurations";
   inputs.nixos-org-configurations.flake = false;
 
   outputs = { self
             , nixpkgs
             , flake-utils
+            , npmlock2nix
             , nixos-org-configurations
             }:
     flake-utils.lib.eachDefaultSystem
       (system:
         let
-          pkgs = nixpkgs.legacyPackages.${system};
+          pkgs = import nixpkgs {
+            inherit system;
+            overlays = [
+              (self: super: {
+                npmlock2nix = super.callPackage npmlock2nix {};
+              })
+            ];
+          };
           lib = nixpkgs.lib;
           warnToUpgradeNix = lib.warn "Please upgrade Nix to 2.7 or later.";
           version = lib.fileContents ./VERSION;
@@ -84,17 +94,13 @@
               packages.flake-info
               packages.frontend
             ];
-            extraPackages = [pkgs.rustfmt];
+            extraPackages = [
+              pkgs.rustfmt
+            ];
             extraShellHook = ''
               export RUST_SRC_PATH="${pkgs.rustPlatform.rustLibSrc}";
               export NIXPKGS_PANDOC_FILTERS_PATH="${packages.flake-info.NIXPKGS_PANDOC_FILTERS_PATH}";
               export PATH=$PWD/frontend/node_modules/.bin:$PATH
-
-              rm -rf frontend/node_modules
-              ln -sf ${packages.frontend.yarnPkg}/libexec/${(builtins.parseDrvName packages.frontend.name).name}/node_modules frontend/
-              echo "========================================================"
-              echo "= To develop the frontend run: cd frontend && yarn dev ="
-              echo "========================================================"
             '';
           };
 

frontend/config/webpack.common.js

@@ -0,0 +1,78 @@
+
+const path = require('path');
+
+const webpack = require("webpack");
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const {CleanWebpackPlugin} = require('clean-webpack-plugin');
+
+
+module.exports = (withDebug) => {
+    return {
+        entry: './src/index.js',
+        output: {
+            path: path.resolve(__dirname, '../dist'),
+            filename: 'bundle.js'
+        },
+        resolve: {
+            modules: [path.join(__dirname, "../src"), 'node_modules'],
+            extensions: [".elm", ".js"]
+        },
+        plugins: [
+            new HtmlWebpackPlugin({
+                template: "./src/index.html"
+            }),
+            new CleanWebpackPlugin(),
+            new webpack.EnvironmentPlugin([
+                "ELASTICSEARCH_MAPPING_SCHEMA_VERSION",
+                "NIXOS_CHANNELS"
+            ]),
+            new webpack.DefinePlugin({
+                'process.env': JSON.stringify(process.env)
+            }),
+        ],
+        optimization: {
+            // Prevents compilation errors causing the hot loader to lose state
+            emitOnErrors: false
+        },
+        module: {
+            rules: [
+                {
+                    test: /\.elm$/,
+                    use: [
+                        {loader: "elm-reloader"},
+                        {
+                            loader: "elm-webpack-loader",
+                            options: {
+                                // add Elm's debug overlay to output
+                                debug: withDebug,
+                                optimize: false
+                            }
+                        }
+                    ]
+                }, {
+                    test: /\.(sa|sc|c)ss$/i,
+                    use: ['style-loader', 'css-loader', {
+                        loader: "postcss-loader",
+                        options: {
+                            postcssOptions: {
+                                plugins: [
+                                    require("autoprefixer"),
+                                ],
+                            },
+                        }
+                    }, "sass-loader"],
+                }, {
+                    test: /\.js$/,
+                    exclude: /node_modules/,
+                    use: {
+                        loader: "babel-loader"
+                    }
+                },
+                {
+                    test: /\.(png|svg|jpg|jpeg|gif)$/i,
+                    type: 'asset/resource',
+                },
+            ],
+        }
+    };
+};

frontend/config/webpack.dev.js

@@ -0,0 +1,34 @@
+const path = require('path');
+
+const {merge} = require('webpack-merge');
+const common = require('./webpack.common.js');
+
+
+const dev = {
+    mode: 'development',
+    devServer: {
+        hot: "only",
+        client: {
+            logging: "info"
+        },
+        static: {directory: path.join(__dirname, "../src/assets")},
+        devMiddleware: {
+            publicPath: "/",
+            stats: "errors-only"
+        },
+        historyApiFallback: true,
+        // feel free to delete this section if you don't need anything like this
+        onBeforeSetupMiddleware: function (devServer) {
+            // on port 3000
+            devServer.app.get("/test", function (req, res) {
+                res.json({result: "You reached the dev server"});
+            });
+
+        }
+    },
+};
+
+module.exports = env => {
+    const withDebug = !env.nodebug;
+    return merge(common(withDebug), dev);
+}

frontend/config/webpack.prod.js

@@ -0,0 +1,64 @@
+const {merge} = require('webpack-merge');
+
+const CopyWebpackPlugin = require("copy-webpack-plugin");
+// JS minification
+const TerserPlugin = require("terser-webpack-plugin");
+// Production CSS assets - separate, minimised file
+const MiniCssExtractPlugin = require("mini-css-extract-plugin");
+const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
+
+const common = require('./webpack.common.js');
+
+const prod = {
+    mode: 'production',
+    optimization: {
+        minimize: true,
+        minimizer: [
+            new TerserPlugin(),
+            new CssMinimizerPlugin(),
+        ]
+    },
+    plugins: [
+        // Copy static assets
+        new CopyWebpackPlugin({
+            patterns: [{from: "src/assets"}]
+        }),
+        new MiniCssExtractPlugin({
+            // Options similar to the same options in webpackOptions.output
+            filename: "[name]-[chunkhash].css"
+        })
+    ],
+    module: {
+        rules: [
+            {
+                test: /\.elm$/,
+                use: {
+                    loader: "elm-webpack-loader",
+                    options: {
+                        optimize: true
+                    }
+                }
+            },
+            {
+                test: /\.(sa|sc|c)ss$/i,
+                use: [
+                    MiniCssExtractPlugin.loader,
+                    "css-loader",
+                    {
+                        loader: "postcss-loader",
+                        options: {
+                            postcssOptions: {
+                                plugins: [
+                                    require("autoprefixer"),
+                                ],
+                            },
+                        }
+                    }, "sass-loader"
+                ]
+            }
+        ]
+    }
+
+};
+
+module.exports = merge(common(false), prod);

frontend/default.nix

@@ -2,82 +2,43 @@
 , nixosChannels
 , version
 }:
-let
+pkgs.npmlock2nix.build {
-  package = builtins.fromJSON (builtins.readFile ./package.json);
+  src = ./.;
-  yarnPkg = pkgs.yarn2nix-moretea.mkYarnPackage rec {
+  installPhase = ''
-    name = "${package.name}-yarn-${package.version}";
+    mkdir $out
-    src = null;
+    cp -R dist/* $out
-    dontUnpack = true;
-    packageJSON = ./package.json;
-    yarnLock = ./yarn.lock;
-    preConfigure = ''
-      mkdir ${package.name}
-      cd ${package.name}
-      ln -s ${packageJSON} ./package.json
-      ln -s ${yarnLock} ./yarn.lock
   '';
-    yarnPreBuild = ''
+  postConfigure = pkgs.elmPackages.fetchElmDeps {
-      mkdir -p $HOME/.node-gyp/${pkgs.nodejs.version}
+    elmPackages = import ./elm-srcs.nix;
-      echo 9 > $HOME/.node-gyp/${pkgs.nodejs.version}/installVersion
+    elmVersion = pkgs.elmPackages.elm.version;
-      ln -sfv ${pkgs.nodejs}/include $HOME/.node-gyp/${pkgs.nodejs.version}
+    registryDat = ./registry.dat;
-    '';
-    publishBinsFor =
-      [
-        "webpack"
-        "webpack-dev-server"
-      ];
   };
-in
+  ELASTICSEARCH_MAPPING_SCHEMA_VERSION = version;
-pkgs.stdenv.mkDerivation {
+  NIXOS_CHANNELS = builtins.toJSON nixosChannels;
-  name = "${package.name}-${package.version}";
+  buildCommands = [
-  src = pkgs.lib.cleanSource ./.;
+    "HOME=$PWD npm run prod"
-
+  ];
-  preferLocalBuild = true;
-
   buildInputs = 
-    [
-      yarnPkg
-    ] ++
     (with pkgs; [
       nodejs
       elm2nix
     ]) ++
-    (with pkgs.nodePackages; [
-      yarn
-    ]) ++
     (with pkgs.elmPackages; [
       elm
       elm-format
       elm-language-server
       elm-test
-      elm-analyse
     ]);
-
+  node_modules_attrs = {
-  ELASTICSEARCH_MAPPING_SCHEMA_VERSION = version;
+    sourceOverrides = {
-  NIXOS_CHANNELS = builtins.toJSON nixosChannels;
+      elm = sourceIngo: drv: drv.overrideAttrs (old: {
-
+        postPatch = ''
-  configurePhase = pkgs.elmPackages.fetchElmDeps {
+          sed -i -e "s|download(|//download(|" install.js
-    elmPackages = import ./elm-srcs.nix;
+          sed -i -e "s|request(|//request(|" download.js
-    elmVersion = pkgs.elmPackages.elm.version;
+          sed -i -e "s|var version|return; var version|" download.js
-    registryDat = ./registry.dat;
+          cp ${pkgs.elmPackages.elm}/bin/elm bin/elm
+        '';
+      });
+    };
   };
-
-  patchPhase = ''
-    rm -rf node_modules
-    ln -sf ${yarnPkg}/libexec/${package.name}/node_modules .
-  '';
-
-  buildPhase = ''
-    # Yarn writes cache directories etc to $HOME.
-    export HOME=$PWD/yarn_home
-    yarn prod
-  '';
-
-  installPhase = ''
-    mkdir -p $out
-    cp -R ./dist/* $out/
-    cp netlify.toml $out/
-  '';
-
-  passthru.yarnPkg = yarnPkg;
 }

frontend/package.json

@@ -2,44 +2,56 @@
   "name": "nixos-search",
   "version": "1.0.0",
   "description": "Search NixOS packages and options.",
-  "main": "index.js",
-  "repository": "https://github.com/NixOS/nixos-search",
   "author": "Rok Garbas <rok@garbas.si>",
   "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/NixOS/nixos-search"
+  },
+  "main": "index.js",
   "scripts": {
-    "test": "elm-test",
+    "analyse": "elm-analyse -s -p 3001 -o",
-    "dev": "webpack-dev-server --hot --colors --port 3000",
     "build": "webpack",
-    "prod": "webpack -p",
+    "dev": "webpack serve --port 3000 --config config/webpack.dev.js",
-    "analyse": "elm-analyse -s -p 3001 -o"
+    "nodebug": "webpack serve --port 3000 --config config/webpack.dev.js --env nodebug",
+    "prod": "NODE_ENV=production webpack --config config/webpack.prod.js",
+    "start": "npm run dev",
+    "test": "elm-test"
   },
   "devDependencies": {
-    "@babel/core": "^7.7.2",
+    "@babel/core": "^7.16.5",
-    "@babel/preset-env": "^7.7.1",
+    "@babel/preset-env": "^7.16.5",
-    "babel-loader": "^8.0.6",
+    "autoprefixer": "^10.4.0",
-    "clean-webpack-plugin": "^3.0.0",
+    "babel-loader": "^8.2.3",
-    "closure-webpack-plugin": "^2.0.1",
+    "clean-webpack-plugin": "^4.0.0",
-    "copy-webpack-plugin": "^5.0.5",
+    "copy-webpack-plugin": "^10.2.0",
-    "css-loader": "^3.2.0",
+    "css-loader": "^4.3.0",
-    "elm-analyse": "^0.16.5",
+    "css-minimizer-webpack-plugin": "^3.3.1",
-    "elm-hot-webpack-loader": "^1.1.6",
+    "elm": "^0.19.1-5",
-    "elm-test": "^0.19.1-1",
+    "elm-reloader": "^1.0.0",
-    "elm-webpack-loader": "^6.0.1",
+    "elm-test": "^0.19.1-revision9",
-    "file-loader": "^6.0.0",
+    "elm-webpack-loader": "^8.0.0",
-    "google-closure-compiler": "^20200224.0.0",
+    "file-loader": "^6.2.0",
-    "html-webpack-plugin": "^4.0.2",
+    "html-webpack-plugin": "^5.5.0",
-    "less": "^3.12.2",
+    "mini-css-extract-plugin": "^2.4.5",
-    "less-loader": "^7.0.0",
+    "postcss": "^8.4.4",
-    "mini-css-extract-plugin": "^0.9.0",
+    "postcss-cli": "^9.0.2",
-    "resolve-url-loader": "^3.1.0",
+    "postcss-loader": "^6.2.1",
-    "style-loader": "^1.0.0",
+    "resolve-url-loader": "^4.0.0",
-    "url-loader": "^4.0.0",
+    "sass": "^1.43.5",
-    "webpack": "^4.41.2",
+    "sass-loader": "^12.3.0",
-    "webpack-cli": "^3.3.10",
+    "style-loader": "^3.3.1",
-    "webpack-dev-server": "^3.9.0",
+    "terser-webpack-plugin": "^5.3.0",
-    "webpack-merge": "^4.2.2"
+    "url-loader": "^4.1.1",
+    "webpack": "^5.64.4",
+    "webpack-cli": "^4.9.1",
+    "webpack-dev-server": "^4.6.0",
+    "webpack-merge": "^5.8.0"
   },
-  "dependencies": {
+  "engines": {
-    "purecss": "^1.0.1"
+    "node": ">=12"
+  },
+  "prettier": {
+    "tabWidth": 4
   }
 }

frontend/src/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-require("./index.less");
+require("./index.scss");
 
 const {Elm} = require('./Main');
 

frontend/src/index.scss

@@ -2,14 +2,14 @@
 /* -- Utils ---------------------------------------------------------------- */
 /* ------------------------------------------------------------------------- */
 
-.terminal() {
+@mixin terminal() {
   background: #333;
   color: #fff;
   margin: 0;
 }
 
 
-.search-result-item() {
+@mixin search-result-item() {
   .result-item-show-more-wrapper {
       text-align: center;
   }
@@ -358,7 +358,7 @@ header .navbar.navbar-static-top {
           }
 
           &.package {
-            .search-result-item();
+            @include search-result-item;
 
             // Description
             & > :nth-child(2) {
@@ -417,7 +417,7 @@ header .navbar.navbar-static-top {
                 }
 
                 pre {
-                  .terminal();
+                  @include terminal;
                 }
 
               }
@@ -532,18 +532,6 @@ header .navbar.navbar-static-top {
 .loader:after {
   left: 1.5em;
 }
-@-webkit-keyframes load1 {
-  0%,
-  80%,
-  100% {
-    box-shadow: 0 0;
-    height: 4em;
-  }
-  40% {
-    box-shadow: 0 -2em;
-    height: 5em;
-  }
-}
 @keyframes load1 {
   0%,
   80%,

frontend/webpack.config.js

@@ -1,189 +0,0 @@
-const path = require("path");
-const webpack = require("webpack");
-const merge = require("webpack-merge");
-
-const ClosurePlugin = require('closure-webpack-plugin');
-const CopyWebpackPlugin = require("copy-webpack-plugin");
-const HTMLWebpackPlugin = require("html-webpack-plugin");
-const { CleanWebpackPlugin } = require('clean-webpack-plugin');
-// to extract the css as a separate file
-const MiniCssExtractPlugin = require("mini-css-extract-plugin");
-
-var MODE =
-    process.env.npm_lifecycle_event === "prod" ? "production" : "development";
-var withDebug = !process.env["npm_config_nodebug"] && MODE == "development";
-// this may help for Yarn users
-// var withDebug = !npmParams.includes("--nodebug");
-console.log('\x1b[36m%s\x1b[0m', `** elm-webpack-starter: mode "${MODE}", withDebug: ${withDebug}\n`);
-
-var common = {
-    mode: MODE,
-    entry: "./src/index.js",
-    output: {
-        path: path.join(__dirname, "dist"),
-        publicPath: "/",
-        // FIXME webpack -p automatically adds hash when building for production
-        filename: MODE == "production" ? "[name]-[hash].js" : "index.js"
-    },
-    plugins: [
-        new webpack.EnvironmentPlugin([
-          "ELASTICSEARCH_MAPPING_SCHEMA_VERSION",
-          "NIXOS_CHANNELS"
-        ]),
-        new HTMLWebpackPlugin({
-            // Use this template to get basic responsive meta tags
-            template: "src/index.html",
-            // inject details of output file at end of body
-            inject: "body"
-        })
-    ],
-    resolve: {
-        modules: [path.join(__dirname, "src"), "node_modules"],
-        extensions: [".js", ".elm", ".scss", ".png", ".xml"]
-    },
-    module: {
-        rules: [
-            {
-                test: /\.js$/,
-                exclude: /node_modules/,
-                use: {
-                    loader: "babel-loader"
-                }
-            },
-            {
-                test: /\.less$/,
-                exclude: [/elm-stuff/, /node_modules/],
-                // see https://github.com/webpack-contrib/css-loader#url
-                loaders: ["style-loader", "css-loader?url=false", "less-loader"]
-            },
-            {
-                test: /\.css$/,
-                exclude: [/elm-stuff/, /node_modules/],
-                loaders: ["style-loader", "css-loader?url=false"]
-            },
-            {
-                test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
-                exclude: [/elm-stuff/, /node_modules/],
-                loader: "url-loader",
-                options: {
-                    limit: 10000,
-                    mimetype: "application/font-woff"
-                }
-            },
-            {
-                test: /\.(ttf|eot|svg|xml)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
-                exclude: [/elm-stuff/, /node_modules/],
-                loader: "file-loader"
-            },
-            {
-                test: /\.(jpe?g|png|gif|svg)$/i,
-                exclude: [/elm-stuff/, /node_modules/],
-                loader: "file-loader"
-            }
-        ]
-    }
-};
-
-if (MODE === "development") {
-    module.exports = merge(common, {
-        plugins: [
-            // Suggested for hot-loading
-            new webpack.NamedModulesPlugin(),
-            // Prevents compilation errors causing the hot loader to lose state
-            new webpack.NoEmitOnErrorsPlugin()
-        ],
-        module: {
-            rules: [
-                {
-                    test: /\.elm$/,
-                    exclude: [/elm-stuff/, /node_modules/],
-                    use: [
-                        { loader: "elm-hot-webpack-loader" },
-                        {
-                            loader: "elm-webpack-loader",
-                            options: {
-                                // add Elm's debug overlay to output
-                                debug: withDebug,
-                                //
-                                forceWatch: true
-                            }
-                        }
-                    ]
-                }
-            ]
-        },
-        devServer: {
-            inline: true,
-            stats: "errors-only",
-            contentBase: path.join(__dirname, "src/assets"),
-            historyApiFallback: true,
-            // feel free to delete this section if you don't need anything like this
-            before(app) {
-                // on port 3000
-                app.get("/test", function(req, res) {
-                    res.json({ result: "OK" });
-                });
-            }
-        }
-    });
-}
-if (MODE === "production") {
-    module.exports = merge(common, {
-        //optimization: {
-        //    minimizer: [
-        //        new ClosurePlugin({mode: 'STANDARD'}, {})
-        //    ]
-        //},
-        plugins: [
-            // Delete everything from output-path (/dist) and report to user
-            new CleanWebpackPlugin({
-                root: __dirname,
-                exclude: [],
-                verbose: true,
-                dry: false
-            }),
-            // Copy static assets
-            new CopyWebpackPlugin([
-                {
-                    from: "src/assets"
-                }
-            ]),
-            new MiniCssExtractPlugin({
-                // Options similar to the same options in webpackOptions.output
-                // both options are optional
-                filename: "[name]-[hash].css"
-            })
-        ],
-        module: {
-            rules: [
-                {
-                    test: /\.elm$/,
-                    exclude: [/elm-stuff/, /node_modules/],
-                    use: {
-                        loader: "elm-webpack-loader",
-                        options: {
-                            optimize: true
-                        }
-                    }
-                },
-                {
-                    test: /\.css$/,
-                    exclude: [/elm-stuff/, /node_modules/],
-                    loaders: [
-                        MiniCssExtractPlugin.loader,
-                        "css-loader?url=false"
-                    ]
-                },
-                {
-                    test: /\.less$/,
-                    exclude: [/elm-stuff/, /node_modules/],
-                    loaders: [
-                        MiniCssExtractPlugin.loader,
-                        "css-loader?url=false",
-                        "less-loader"
-                    ]
-                }
-            ]
-        }
-    });
-}