/* eslint-disable @typescript-eslint/no-var-requires */ var path = require("path"); var webpack = require("webpack"); var MiniCssExtractPlugin = require("mini-css-extract-plugin"); var HtmlWebpackPlugin = require("html-webpack-plugin"); module.exports = (env, argv) => { const isDevServer = (env || {}).devServer === true; const runInContainer = (env || {}).runInContainer === true; const isDevelopment = argv.mode === "development"; const outputDirectory = isDevServer ? "dist-dev" : "dist"; const entries = {}; entries[`${outputDirectory}/engine`] = "./src/engine.jsx"; entries[`${outputDirectory}/engineStyle`] = "./src/engineStyle.js"; const statsConfig = { builtAt: true, children: false, chunks: false, chunkGroups: false, chunkModules: false, chunkOrigins: false, colors: true, entrypoints: true, }; const devServerSettings = { port: 8000, publicPath: `/`, stats: statsConfig, }; // By default, the webpack-dev-server is not exposed outside of localhost. // When running in a container we need it accessible externally. if (runInContainer) { devServerSettings.disableHostCheck = true; devServerSettings.host = "0.0.0.0"; devServerSettings.watchOptions = { poll: true, }; } return { plugins: [ new webpack.DefinePlugin({ "process.env.NODE_ENV": isDevelopment ? '"development"' : '"production"', }), // http://stackoverflow.com/questions/29080148/expose-jquery-to-real-window-object-with-webpack new webpack.ProvidePlugin({ // Automtically detect jQuery and $ as free var in modules // and inject the jquery library // This is required by many jquery plugins jquery: "jquery", jQuery: "jquery", $: "jquery", }), new HtmlWebpackPlugin({ title: "Bitburner" + (isDevelopment ? " - development" : ""), template: "src/index.html", favicon: "favicon.ico", googleAnalytics: { trackingId: "UA-100157497-1", }, meta: {}, minify: isDevelopment ? false : { collapseBooleanAttributes: true, collapseInlineTagWhitespace: false, collapseWhitespace: false, conservativeCollapse: false, html5: true, includeAutoGeneratedTags: false, keepClosingSlash: true, minifyCSS: false, minifyJS: false, minifyURLs: false, preserveLineBreaks: false, preventAttributesEscaping: false, processConditionalComments: false, quoteCharacter: '"', removeAttributeQuotes: false, removeComments: false, removeEmptyAttributes: false, removeEmptyElements: false, removeOptionalTags: false, removeScriptTypeAttributes: false, removeStyleLinkTypeAttributes: false, removeTagWhitespace: false, sortAttributes: false, sortClassName: false, useShortDoctype: false, }, }), new MiniCssExtractPlugin({ filename: "[name].css", }), ], target: "web", entry: entries, devtool: "source-map", output: { path: path.resolve(__dirname, "./"), filename: "[name].bundle.js", }, module: { rules: [ { test: /\.tsx?$/, exclude: /node_modules/, use: { loader: "swc-loader", options: { jsc: { parser: { syntax: "typescript", tsx: true, }, }, }, }, }, { test: /\.(jsx)$/, exclude: /node_modules/, use: { loader: "swc-loader", options: { jsc: { parser: { syntax: "ecmascript", jsx: true, }, }, }, }, }, { test: /\.s?css$/, use: [MiniCssExtractPlugin.loader, "css-loader", "sass-loader"], }, ], }, optimization: { removeAvailableModules: true, removeEmptyChunks: true, mergeDuplicateChunks: true, flagIncludedChunks: true, occurrenceOrder: true, sideEffects: true, providedExports: true, usedExports: true, concatenateModules: false, namedModules: false, namedChunks: false, minimize: !isDevelopment, portableRecords: true, splitChunks: { cacheGroups: { vendor: { test: /[\\/]node_modules[\\/]/, name: `${outputDirectory}/vendor`, chunks: "all", }, }, }, }, devServer: devServerSettings, resolve: { extensions: [".tsx", ".ts", ".js", ".jsx"], }, stats: statsConfig, }; };