From a7831f3f71d5865ec94b0dd4cab68d26f92ce2d9 Mon Sep 17 00:00:00 2001 From: Ryan Palmer Date: Mon, 22 Nov 2021 17:45:55 +0000 Subject: [PATCH 1/9] Updated deps, including webpack. Updated webpack config to new format, and explicitly passed it to the build cmd as it wasn't being picked up automatically. --- Content/default/Build.fs | 2 +- Content/default/package.json | 28 +++++++++---------- Content/default/webpack.config.js | 45 ++++++++++++++++++++----------- 3 files changed, 45 insertions(+), 30 deletions(-) diff --git a/Content/default/Build.fs b/Content/default/Build.fs index 06b912bb..ecbf888a 100644 --- a/Content/default/Build.fs +++ b/Content/default/Build.fs @@ -46,7 +46,7 @@ Target.create "Azure" (fun _ -> Target.create "Run" (fun _ -> run dotnet "build" sharedPath [ "server", dotnet "watch run" serverPath - "client", dotnet "fable watch -o output -s --run webpack-dev-server" clientPath ] + "client", dotnet "fable watch -o output -s --run webpack-dev-server --config ../../webpack.config.js" clientPath ] |> runParallel ) diff --git a/Content/default/package.json b/Content/default/package.json index ec372af9..19415ffb 100644 --- a/Content/default/package.json +++ b/Content/default/package.json @@ -6,20 +6,20 @@ "test:live": "webpack-dev-server --config webpack.tests.config.js" }, "devDependencies": { - "copy-webpack-plugin": "^6.1.0", - "css-loader": "^5.2.6", - "file-loader": "^4.2.0", - "html-webpack-plugin": "^3.2.0", - "mini-css-extract-plugin": "^0.10.0", - "react": "^16.10.2", - "react-dom": "^16.10.2", + "copy-webpack-plugin": "^9.1.0", + "css-loader": "^6.5.1", + "file-loader": "^6.2.0", + "html-webpack-plugin": "^5.5.0", + "mini-css-extract-plugin": "^2.4.5", + "react": "^17.0.2", + "react-dom": "^17.0.2", "remotedev": "^0.2.9", - "sass": "^1.34.0", - "sass-loader": "^9.0.3", - "source-map-loader": "^1.1.3", - "style-loader": "^1.2.1", - "webpack": "^4.41.2", - "webpack-cli": "^3.3.9", - "webpack-dev-server": "^3.8.2" + "sass": "^1.43.4", + "sass-loader": "^12.3.0", + "source-map-loader": "^3.0.0", + "style-loader": "^3.3.1", + "webpack": "^5.64.2", + "webpack-cli": "^4.9.1", + "webpack-dev-server": "^4.5.0" } } diff --git a/Content/default/webpack.config.js b/Content/default/webpack.config.js index 9677fa02..4a828150 100644 --- a/Content/default/webpack.config.js +++ b/Content/default/webpack.config.js @@ -10,6 +10,11 @@ var HtmlWebpackPlugin = require('html-webpack-plugin'); var CopyWebpackPlugin = require('copy-webpack-plugin'); var MiniCssExtractPlugin = require('mini-css-extract-plugin') +// If we're running the webpack-dev-server, assume we're in development mode +var isProduction = !process.argv.find(v => v.indexOf('webpack-dev-server') !== -1); +var mode = isProduction ? 'production' : 'development'; +process.env.NODE_ENV = mode; + var CONFIG = { // The tags to include the generated JS and CSS will be automatically injected in the HTML template // See https://github.com/jantimon/html-webpack-plugin @@ -24,21 +29,17 @@ var CONFIG = { // redirect requests that start with /api/ to the server on port 8085 '/api/**': { target: 'http://localhost:' + (process.env.SERVER_PROXY_PORT || "8085"), - changeOrigin: true - }, + changeOrigin: true + }, // redirect websocket requests that start with /socket/ to the server on the port 8085 '/socket/**': { target: 'http://localhost:' + (process.env.SERVER_PROXY_PORT || "8085"), ws: true - } - } + } + } } -// If we're running the webpack-dev-server, assume we're in development mode -var isProduction = !process.argv.find(v => v.indexOf('webpack-dev-server') !== -1); -var environment = isProduction ? 'production' : 'development'; -process.env.NODE_ENV = environment; -console.log('Bundling for ' + environment + '...'); +console.log('Bundling for ' + mode + '...'); // The HtmlWebpackPlugin allows us to use a template for the index.html page // and automatically injects