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 isDevelopment = argv.mode === 'development'; const outputDirectory = isDevServer ? "dist-dev" : "dist"; const entries = {}; entries[`${outputDirectory}/engine`] = "./src/engine.jsx"; if (!isDevServer) { entries["tests/tests"] = "./tests/index.js"; } 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 }, excludeChunks: [ "tests/tests" ] }), 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?$/, loader: 'ts-loader', exclude: /node_modules/ }, { test: /\.(jsx)$/, exclude: /node_modules/, use: { loader: "babel-loader" } }, { 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: { port: 8000, publicPath: `/`, }, resolve: { extensions: [ ".tsx", ".ts", ".js", ".jsx", ] } }; };