upgrade react, react-scripts and build overrides

This commit is contained in:
Rick Watson 2019-04-14 17:03:28 +01:00
parent e36105f9f2
commit 9ee875c2a5
5 changed files with 35 additions and 28 deletions

View File

@ -1 +1 @@
REACT_APP_ENDPOINT_ROOT=http://192.168.0.6/rest/ REACT_APP_ENDPOINT_ROOT=http://192.168.0.26/rest/

View File

@ -1 +1,2 @@
REACT_APP_ENDPOINT_ROOT=/rest/ REACT_APP_ENDPOINT_ROOT=/rest/
GENERATE_SOURCEMAP=false

View File

@ -1,7 +1,7 @@
const CompressionPlugin = require("compression-webpack-plugin");
const ManifestPlugin = require('webpack-manifest-plugin'); const ManifestPlugin = require('webpack-manifest-plugin');
const SWPrecacheWebpackPlugin = require('sw-precache-webpack-plugin'); const WorkboxWebpackPlugin = require('workbox-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin'); const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const CompressionPlugin = require("compression-webpack-plugin");
const path = require('path'); const path = require('path');
const fs = require('fs'); const fs = require('fs');
@ -9,21 +9,21 @@ const fs = require('fs');
module.exports = function override(config, env) { module.exports = function override(config, env) {
if (env === "production") { if (env === "production") {
// rename the ouput file, we need it's path to be short, for SPIFFS // rename the ouput file, we need it's path to be short, for SPIFFS
config.output.filename = 'js/[name].[chunkhash:4].js'; config.output.filename = 'js/[id].[chunkhash:4].js';
config.output.chunkFilename = 'js/[id].[chunkhash:4].js';
// disable sourcemap for production build // take out the manifest and service worker plugins
config.devtool = false;
// take out the manifest and service worker
config.plugins = config.plugins.filter(plugin => !(plugin instanceof ManifestPlugin)); config.plugins = config.plugins.filter(plugin => !(plugin instanceof ManifestPlugin));
config.plugins = config.plugins.filter(plugin => !(plugin instanceof SWPrecacheWebpackPlugin)); config.plugins = config.plugins.filter(plugin => !(plugin instanceof WorkboxWebpackPlugin.GenerateSW));
const extractTextPlugin = config.plugins.find((plugin) => plugin instanceof ExtractTextPlugin); // shorten css filenames
extractTextPlugin.filename = "css/[name].[contenthash:4].css"; const miniCssExtractPlugin = config.plugins.find((plugin) => plugin instanceof MiniCssExtractPlugin);
miniCssExtractPlugin.options.filename = "css/[id].[contenthash:4].css";
miniCssExtractPlugin.options.chunkFilename = "css/[id].[contenthash:4].c.css";
// add compression plugin, compress javascript // add compression plugin, compress javascript
config.plugins.push(new CompressionPlugin({ config.plugins.push(new CompressionPlugin({
asset: "[path].gz[query]", filename: "[path].gz[query]",
algorithm: "gzip", algorithm: "gzip",
test: /\.(js)$/, test: /\.(js)$/,
deleteOriginalAssets: true deleteOriginalAssets: true

View File

@ -5,17 +5,17 @@
"dependencies": { "dependencies": {
"@material-ui/core": "^3.9.3", "@material-ui/core": "^3.9.3",
"@material-ui/icons": "^3.0.2", "@material-ui/icons": "^3.0.2",
"compression-webpack-plugin": "^1.1.12", "compression-webpack-plugin": "^2.0.0",
"moment": "^2.22.2", "moment": "^2.24.0",
"prop-types": "^15.6.2", "prop-types": "^15.7.2",
"react": "^16.5.1", "react": "^16.8.6",
"react-dom": "^16.5.1", "react-dom": "^16.8.6",
"react-form-validator-core": "^0.3.0", "react-form-validator-core": "^0.6.2",
"react-jss": "^8.6.1", "react-jss": "^8.6.1",
"react-material-ui-form-validator": "^2.0.1", "react-material-ui-form-validator": "^2.0.7",
"react-router": "^4.3.1", "react-router": "^5.0.0",
"react-router-dom": "^4.3.1", "react-router-dom": "^5.0.0",
"react-scripts": "1.0.17" "react-scripts": "2.1.8"
}, },
"scripts": { "scripts": {
"start": "react-app-rewired start", "start": "react-app-rewired start",
@ -24,6 +24,12 @@
"eject": "react-scripts eject" "eject": "react-scripts eject"
}, },
"devDependencies": { "devDependencies": {
"react-app-rewired": "^1.6.2" "react-app-rewired": "^2.1.1"
} },
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
]
} }

View File

@ -79,9 +79,9 @@ class WiFiSettingsForm extends React.Component {
} }
render() { render() {
const { classes, formRef, wifiSettingsFetched, wifiSettings, errorMessage, selectedNetwork, handleValueChange, handleCheckboxChange, onSubmit, onReset } = this.props; const { classes, wifiSettingsFetched, wifiSettings, errorMessage, selectedNetwork, handleValueChange, handleCheckboxChange, onSubmit, onReset } = this.props;
return ( return (
<div ref={formRef}> <div>
{ {
!wifiSettingsFetched ? !wifiSettingsFetched ?