Update webpack to v5 (#6844)

* upgrade webpack info

* cleanup eslint findings

* fix eslint formatter stylish error

* lazy is invalid option for webpack dev middleware

* upgrade webpack to 5.x

* remove unsupported terser option

* fix missing process polyfill dependency

* try alternate proces fix

* fix css image reference

* add statements to import missing css files to index.html

* TerserPlugin no longer required

* add missing css links

* remove terser

Co-authored-by: Jeremy Cunningham <jpcunningh@gmail.com>
Co-authored-by: Sulka Haro <sulka@sulka.net>
This commit is contained in:
Jeremy Cunningham
2021-02-07 17:25:19 +02:00
committed by GitHub
co-authored by Jeremy Cunningham Sulka Haro
parent bc188d9163
commit 1c349527a1
19 changed files with 1818 additions and 1986 deletions
+1
View File
@@ -66,6 +66,7 @@ function init (client, $) {
if (messages && messages.length > 0) {
html += '<p><b>' + translate('You have administration messages') + '</b></p>';
for(var i = 0 ; i < messages.length; i++) {
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
var m = messages[i];
const ago = Math.round((Date.now() - m.lastRecorded) / 60000);
html += wrapmessage(translate(m.title), translate(m.message), m.count, ago, m.persistent);
+10 -2
View File
@@ -252,6 +252,7 @@ function init (client, $) {
var html = '<table style="float:right;margin-right:20px;font-size:12px">';
var carbs = 0;
for (var fi = 0; fi < record.foods.length; fi++) {
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
var f = record.foods[fi];
carbs += f.carbs * f.portions;
html += '<tr>';
@@ -426,6 +427,7 @@ function init (client, $) {
if (record.foods.length) {
var gisum = 0;
for (var fi = 0; fi < record.foods.length; fi++) {
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
var f = record.foods[fi];
record.carbs += f.carbs * f.portions;
gisum += f.carbs * f.portions * f.gi;
@@ -576,7 +578,7 @@ function init (client, $) {
foods = [];
$('#bc_addfoodarea').css('display', '');
} else {
var qp = quickpicks[qpiselected];
var qp = quickpicks[parseInt(qpiselected)];
foods = _.cloneDeep(qp.foods);
$('#bc_addfoodarea').css('display', 'none');
}
@@ -589,7 +591,7 @@ function init (client, $) {
var qpiselected = $('#bc_quickpick').val();
if (qpiselected >= 0) {
var qp = quickpicks[qpiselected];
var qp = quickpicks[parseInt(qpiselected)];
if (qp.hideafteruse) {
qp.hidden = true;
@@ -652,6 +654,7 @@ function init (client, $) {
});
$('#bc_quickpick').empty().append('<option value="-1">' + translate('(none)') + '</option>');
for (var i = 0; i < records.length; i++) {
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
var r = records[i];
$('#bc_quickpick').append('<option value="' + i + '">' + r.name + ' (' + r.carbs + ' g)</option>');
}
@@ -696,6 +699,7 @@ function init (client, $) {
}
$('#bc_data').empty();
for (var i = 0; i < foodlist.length; i++) {
/* eslint-disable security/detect-object-injection */ // verified false positive
if (filter.category !== '' && foodlist[i].category !== filter.category) { continue; }
if (filter.subcategory !== '' && foodlist[i].subcategory !== filter.subcategory) { continue; }
if (filter.name !== '' && foodlist[i].name.toLowerCase().indexOf(filter.name.toLowerCase()) < 0) { continue; }
@@ -705,6 +709,7 @@ function init (client, $) {
o += foodlist[i].unit + ' | ';
o += 'Carbs: ' + foodlist[i].carbs + ' g';
$('#bc_data').append('<option value="' + i + '">' + o + '</option>');
/* eslint-enable security/detect-object-injection */ // verified false positive
}
$('#bc_addportions').val('1');
@@ -728,8 +733,11 @@ function init (client, $) {
var index = $('#bc_data').val();
var portions = parseFloat($('#bc_addportions').val().replace(',', '.'));
if (index !== null && !isNaN(portions) && portions > 0) {
index = parseInt(index);
/* eslint-disable security/detect-object-injection */ // verified false positive
foodlist[index].portions = portions;
foods.push(_.cloneDeep(foodlist[index]));
/* eslint-enable security/detect-object-injection */ // verified false positive
$(this).dialog('close');
boluscalc.calculateInsulin();
}
+3
View File
@@ -170,6 +170,7 @@ function init (client, serverSettings, $) {
});
//if there is a token, append it to each of the links in the hamburger menu
/* eslint-disable security/detect-possible-timing-attacks */ // verified false positive
if (token != '') {
token = '?token=' + token;
$('#reportlink').attr('href', 'report' + token);
@@ -215,6 +216,7 @@ function init (client, serverSettings, $) {
function storeInBrowser (data) {
Object.keys(data).forEach(k => {
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
storage.set(k, data[k]);
});
}
@@ -279,6 +281,7 @@ function init (client, serverSettings, $) {
try {
settings.eachSetting(function setEach (name) {
var stored = storage.get(name);
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
return stored !== undefined && stored !== null ? stored : serverSettings.settings[name];
});
+26 -4
View File
@@ -76,6 +76,13 @@ function init (client, $) {
}
}
// validate the eventType input - should never hit this but bail if we do
if (!Object.prototype.hasOwnProperty.call(inputMatrix, eventType)) {
maybePrevent(event);
return;
}
/* eslint-disable security/detect-object-injection */ // verified false positive by check above
var reasons = inputMatrix[eventType]['reasons'];
$('#reasonLabel').css('display', displayType(reasons && reasons.length > 0));
$('#targets').css('display', displayType(inputMatrix[eventType]['targets']));
@@ -125,13 +132,20 @@ function init (client, $) {
resetIfHidden(inputMatrix[eventType]['prebolus'], '#preBolus');
resetIfHidden(inputMatrix[eventType]['split'], '#insulinSplitNow');
resetIfHidden(inputMatrix[eventType]['split'], '#insulinSplitExt');
/* eslint-enable security/detect-object-injection */ // verified false positive
maybePrevent(event);
};
careportal.reasonable = function reasonable () {
var eventType = $('#eventType').val();
var reasons = inputMatrix[eventType]['reasons'];
var reasons = [];
// validate the eventType input before getting the reasons list
if (Object.prototype.hasOwnProperty.call(inputMatrix, eventType)) {
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
reasons = inputMatrix[eventType]['reasons'];
}
var selected = $('#reason').val();
var reason = _.find(reasons, function matches (r) {
@@ -267,7 +281,13 @@ function init (client, $) {
delete data.preBolus;
}
var reasons = inputMatrix[eventType]['reasons'];
var reasons = [];
// validate the eventType input before getting the reasons list
if (Object.prototype.hasOwnProperty.call(inputMatrix, eventType)) {
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
reasons = inputMatrix[eventType]['reasons'];
}
var reason = _.find(reasons, function matches (r) {
return r.name === selectedReason;
});
@@ -315,9 +335,11 @@ function init (client, $) {
let d = {};
Object.keys(data).forEach(function(key) {
/* eslint-disable security/detect-object-injection */ // verified false positive
if (data[key] !== "" && data[key] !== null) {
d[key] = data[key]
}
d[key] = data[key]
}
/* eslint-enable security/detect-object-injection */ // verified false positive
});
return d;
+1
View File
@@ -703,6 +703,7 @@ function init (client, d3, $) {
var pointTypes = client.settings.showForecast.split(' ');
var points = pointTypes.reduce( function (points, type) {
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
return points.concat(client.sbx.pluginBase.forecastPoints[type] || []);
}, [] );
+8 -4
View File
@@ -90,11 +90,15 @@ client.render = function render () {
for (let param in faceParams) {
if (param === '0') {
bgColor = (faceParams[param].substr(0, 1) === 'c'); // do we want colorful background?
alwaysShowTime = (faceParams[param].substr(1, 1) === 'y'); // always show "stale time" text?
staleMinutes = (faceParams[param].substr(2, 2) - 0 >= 0) ? faceParams[param].substr(2, 2) : 13; // threshold value (0=never)
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
let faceParam = faceParams[param];
bgColor = (faceParam.substr(0, 1) === 'c'); // do we want colorful background?
alwaysShowTime = (faceParam.substr(1, 1) === 'y'); // always show "stale time" text?
staleMinutes = (faceParam.substr(2, 2) - 0 >= 0) ? faceParam.substr(2, 2) : 13; // threshold value (0=never)
} else if (!clockCreated) {
let div = '<div class="' + faceParams[param].substr(0, 2) + '"' + ((faceParams[param].substr(2, 2) - 0 > 0) ? ' style="' + ((faceParams[param].substr(0, 2) === 'ar') ? 'height' : 'font-size') + ':' + faceParams[param].substr(2, 2) + 'vmin"' : '') + '></div>';
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
let faceParam = faceParams[param];
let div = '<div class="' + faceParam.substr(0, 2) + '"' + ((faceParam.substr(2, 2) - 0 > 0) ? ' style="' + ((faceParam.substr(0, 2) === 'ar') ? 'height' : 'font-size') + ':' + faceParam.substr(2, 2) + 'vmin"' : '') + '></div>';
$inner.append(div);
}
}
+6 -1
View File
@@ -234,9 +234,14 @@ d3locales.locale = function locale (language) {
,bg: 'bg_BG'
};
var loc = 'en_US';
if (mapper[language]) {
// validate the eventType input before getting the reasons list
if (Object.prototype.hasOwnProperty.call(mapper, language)) {
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
loc = mapper[language];
}
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
return d3locales[loc];
};
+10 -1
View File
@@ -871,9 +871,15 @@ client.load = function load (serverSettings, callback) {
function getClientAlarm (level, group) {
var key = level + '-' + group;
var alarm = clientAlarms[key];
var alarm = null;
// validate the key before getting the alarm
if (Object.prototype.hasOwnProperty.call(clientAlarms, key)) {
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
alarm = clientAlarms[key];
}
if (!alarm) {
alarm = { level: level, group: group };
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
clientAlarms[key] = alarm;
}
return alarm;
@@ -963,6 +969,7 @@ client.load = function load (serverSettings, callback) {
document.addEventListener(visibilityChange, function visibilityChanged () {
var prevHidden = client.documentHidden;
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
client.documentHidden = document[hidden];
if (prevHidden && !client.documentHidden) {
@@ -1002,6 +1009,7 @@ client.load = function load (serverSettings, callback) {
$('.bgButton').click(function(e) {
if (alarmingNow()) {
/* eslint-disable-next-line security/detect-non-literal-fs-filename */ // verified false positive
silenceDropdown.open(e);
}
});
@@ -1016,6 +1024,7 @@ client.load = function load (serverSettings, callback) {
Storages.localStorage.set('focusHours', hours);
refreshChart();
} else {
/* eslint-disable-next-line security/detect-non-literal-fs-filename */ // verified false positive
viewDropdown.open(e);
}
});
+7
View File
@@ -11,17 +11,21 @@ function mergeDataUpdate (isDelta, cachedDataArray, receivedDataArray, maxAge) {
var l = oldArray.length;
for (var i = 0; i < l; i++) {
/* eslint-disable security/detect-object-injection */ // verified false positive
if (oldArray[i] !== null) {
seen.push(oldArray[i].mills);
}
/* eslint-enable security/detect-object-injection */ // verified false positive
}
var result = [];
l = newArray.length;
for (var j = 0; j < l; j++) {
/* eslint-disable security/detect-object-injection */ // verified false positive
if (!seen.includes(newArray[j].mills)) {
result.push(newArray[j]); //console.log('delta data found');
}
/* eslint-enable security/detect-object-injection */ // verified false positive
}
return result;
}
@@ -41,6 +45,7 @@ function mergeDataUpdate (isDelta, cachedDataArray, receivedDataArray, maxAge) {
var twoDaysAgo = new Date().getTime() - mAge;
for (var i = 0; i < cachedDataArray.length; i++) {
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
var element = cachedDataArray[i];
if (element !== null && element !== undefined && element.mills <= twoDaysAgo) {
cachedDataArray.splice(i, 0);
@@ -70,12 +75,14 @@ function mergeTreatmentUpdate (isDelta, cachedDataArray, receivedDataArray) {
var l = receivedDataArray.length;
var m = cachedDataArray.length;
for (var i = 0; i < l; i++) {
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
var no = receivedDataArray[i];
if (!no.action) {
cachedDataArray.push(no);
continue;
}
for (var j = 0; j < m; j++) {
/* eslint-disable security/detect-object-injection */ // verified false positive
if (no._id === cachedDataArray[j]._id) {
if (no.action === 'remove') {
cachedDataArray.splice(j, 1);
+1
View File
@@ -618,6 +618,7 @@ function init (client, d3) {
if (treatment.boluscalc.foods && treatment.boluscalc.foods.length) {
html += '<table><tr><td><strong>' + translate('Food') + '</strong></td></tr>';
for (var fi = 0; fi < treatment.boluscalc.foods.length; fi++) {
/* eslint-disable-next-line security/detect-object-injection */ // verified false positive
var f = treatment.boluscalc.foods[fi];
html += '<tr>';
html += '<td>' + f.name + '</td>';
+2 -1
View File
@@ -106,7 +106,7 @@ function init (fs) {
if (keys) {
for (i = 0; i < keys.length; i++) {
// eslint-disable-next-line no-useless-escape
/* eslint-disable-next-line no-useless-escape, security/detect-non-literal-regexp */ // validated false positive
var r = new RegExp('\%' + (i + 1), 'g');
translated = translated.replace(r, keys[i]);
}
@@ -144,6 +144,7 @@ function init (fs) {
language.loadLocalization = function loadLocalization (fs, path) {
let filename = './translations/' + this.getFilename(this.lang);
if (path) filename = path.resolve(__dirname, filename);
/* eslint-disable-next-line security/detect-non-literal-fs-filename */ // verified false positive; well defined set of values
const l = fs.readFileSync(filename);
this.offerTranslations(JSON.parse(l));
}
-1
View File
@@ -311,7 +311,6 @@ function create (env, ctx) {
middleware(compiler, {
// webpack-dev-middleware options
publicPath: webpack_conf.output.publicPath
, lazy: false
})
);
+1675 -1915
View File
File diff suppressed because it is too large Load Diff
+16 -11
View File
@@ -71,6 +71,8 @@
"dependencies": {
"@babel/core": "^7.11.1",
"@babel/preset-env": "^7.12.11",
"acorn": "^8.0.5",
"acorn-jsx": "^5.3.1",
"apn": "^2.2.0",
"async": "^0.9.2",
"babel-loader": "^8.1.0",
@@ -78,8 +80,10 @@
"body-parser": "^1.19.0",
"bootevent": "0.0.1",
"braces": "^3.0.2",
"buffer": "^6.0.3",
"compression": "^1.7.4",
"css-loader": "^1.0.1",
"crypto-browserify": "^3.12.0",
"css-loader": "^5.0.1",
"cssmin": "^0.4.3",
"csv-stringify": "^5.5.1",
"d3": "^5.16.0",
@@ -88,10 +92,10 @@
"ejs": "^2.7.4",
"errorhandler": "^1.5.1",
"event-stream": "3.3.4",
"expose-loader": "^0.7.5",
"expose-loader": "^2.0.0",
"express": "^4.17.1",
"express-minify": "^1.0.0",
"file-loader": "^3.0.1",
"file-loader": "^6.2.0",
"flot": "^0.8.3",
"helmet": "^4.0.0",
"jquery": "^3.5.1",
@@ -114,6 +118,7 @@
"owasp-password-strength-test": "^1.3.0",
"parse-duration": "^0.1.3",
"pem": "^1.14.4",
"process": "^0.11.10",
"pushover-notifications": "^1.2.2",
"random-token": "0.0.8",
"request": "^2.88.2",
@@ -122,33 +127,33 @@
"shiro-trie": "^0.4.9",
"simple-statistics": "^0.7.0",
"socket.io": "~2.1.1",
"stream-browserify": "^3.0.0",
"style-loader": "^0.23.1",
"swagger-ui-dist": "^3.32.1",
"swagger-ui-express": "^4.1.4",
"terser": "^3.17.0",
"traverse": "^0.6.6",
"uuid": "^3.4.0",
"webpack": "^4.44.1",
"webpack-cli": "^3.3.12"
"webpack": "^5.20.2",
"webpack-cli": "^4.5.0"
},
"devDependencies": {
"@types/tough-cookie": "^4.0.0",
"axios": "^0.21.1",
"babel-eslint": "^10.1.0",
"benv": "^3.3.0",
"codacy-coverage": "^3.4.0",
"csv-parse": "^4.12.0",
"env-cmd": "^10.1.0",
"eslint": "^6.8.0",
"eslint-loader": "^2.2.1",
"eslint": "^7.19.0",
"eslint-plugin-security": "^1.4.0",
"eslint-webpack-plugin": "^2.4.3",
"mocha": "^8.1.1",
"nodemon": "^1.19.4",
"nyc": "^14.1.1",
"should": "^13.2.3",
"supertest": "^3.4.2",
"terser-webpack-plugin": "^1.4.5",
"webpack-bundle-analyzer": "^3.8.0",
"webpack-dev-middleware": "^3.7.2",
"webpack-bundle-analyzer": "^4.4.0",
"webpack-dev-middleware": "^4.1.0",
"webpack-hot-middleware": "^2.25.0",
"xml2js": "^0.4.23"
},
+1 -1
View File
@@ -227,7 +227,7 @@ h1, legend,
padding: 0 15px 0 40px;
position: relative;
align-items: center;
background: url(/images/logo2.png) no-repeat 3px center #333;
background: url("../images/logo2.png") no-repeat 3px center #333;
border-bottom: 1px solid #999;
justify-content: space-between;
}
+1
View File
@@ -29,6 +29,7 @@
<link rel="preload" href="/css/main.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<link rel="preload" href="/css/drawer.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<link rel="preload" href="/css/admin.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<link rel="preload" href="/css/dropdown.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<link rel="preload" href="/css/ui-darkness/jquery-ui.min.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<%- include('preloadCSS')%>
</head>
+2
View File
@@ -31,6 +31,8 @@
<link rel="preload" href="css/ui-darkness/jquery-ui.min.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<link rel="preload" href="css/jquery.tooltips.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<link rel="preload" href="css/main.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<link rel="preload" href="css/drawer.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<link rel="preload" href="css/dropdown.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<style media="screen" type="text/css">
#centerMessagePanel {
+2
View File
@@ -24,7 +24,9 @@
<meta name="theme-color" content="#333333">
<link rel="preload" href="/css/main.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<link rel="preload" href="/css/drawer.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<link rel="preload" href="/css/report.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<link rel="preload" href="/css/dropdown.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<link rel="preload" href="/css/ui-lightness/jquery-ui.min.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<%- include('preloadCSS')%>
+44 -43
View File
@@ -3,7 +3,6 @@ const webpack = require('webpack');
const MomentLocalesPlugin = require('moment-locales-webpack-plugin');
const pluginArray = [];
const sourceMapType = 'source-map';
const TerserPlugin = require('terser-webpack-plugin');
const MomentTimezoneDataPlugin = require('moment-timezone-data-webpack-plugin');
/*
@@ -53,6 +52,10 @@ pluginArray.push(new webpack.ProvidePlugin({
'window.$': 'jquery'
}));
pluginArray.push(new webpack.ProvidePlugin({
process: 'process/browser',
}));
// limit Timezone data from Moment
pluginArray.push(new MomentTimezoneDataPlugin({
@@ -68,6 +71,21 @@ pluginArray.push(new MomentLocalesPlugin({
],
}));
if (process.env.NODE_ENV === 'development') {
const ESLintPlugin = require('eslint-webpack-plugin');
pluginArray.push(new ESLintPlugin({
emitWarning: true,
failOnError: false,
failOnWarning: false,
formatter: require('eslint').CLIEngine.getFormatter('stylish'),
overrideConfig: {
globals: {
'$': 'writeable'
}
}
}));
}
const rules = [
{
test: /\.(js|jsx)$/,
@@ -80,28 +98,33 @@ const rules = [
}
}
},
{
test: /\.css$/i,
use: [ 'style-loader',
{
loader: 'css-loader',
options: {
sourceMap: true,
},
} ],
exclude: /node_modules/
},
{
test: /\.(jpe?g|png|gif)$/i,
loader: 'file-loader',
query: {
name: '[name].[ext]',
outputPath: 'images/'
options: {
outputPath: 'images'
//the images will be emmited to public/assets/images/ folder
//the images will be put in the DOM <style> tag as eg. background: url(assets/images/image.png);
},
exclude: /node_modules/
},
{
test: /\.css$/,
loaders: ['style-loader', 'css-loader'],
exclude: /node_modules/
},
{
test: require.resolve('jquery'),
use: [{
loader: 'expose-loader',
options: '$'
}]
loader: 'expose-loader',
options: {
exposes: ['$']
}
}
];
@@ -111,7 +134,7 @@ const clockEntry = ['./bundle/bundle.clocks.source.js'];
let mode = 'production';
let publicPath = '/bundle/';
if (process.env.NODE_ENV == 'development') {
if (process.env.NODE_ENV === 'development') {
mode = 'development';
publicPath = '/devbundle/';
pluginArray.push(new webpack.HotModuleReplacementPlugin());
@@ -121,39 +144,10 @@ if (process.env.NODE_ENV == 'development') {
appEntry.unshift(hot);
clockEntry.unshift(hot);
rules.unshift({
enforce: "pre",
test: /\.js$/,
exclude: [/node_modules/, /bundle/],
loader: "eslint-loader",
options: {
emitWarning: true,
failOnError: false,
failOnWarning: false,
formatter: require('eslint/lib/cli-engine/formatters/stylish')
}
});
}
const optimization = {};
if (process.env.NODE_ENV !== 'development') {
optimization.minimizer = [
new TerserPlugin({
cache: true,
parallel: true,
sourceMap: true, // Must be set to true if using source-maps in production
terserOptions: {
ie8: false,
safari10: false
// https://github.com/webpack-contrib/terser-webpack-plugin#terseroptions
}
}),
];
};
module.exports = {
mode,
context: __dirname,
@@ -173,5 +167,12 @@ module.exports = {
plugins: pluginArray,
module: {
rules
},
resolve: {
alias: {
stream: 'stream-browserify',
crypto: 'crypto-browserify',
buffer: 'buffer',
}
}
};