migrates to webpack 4 to enforce security (#818)

Signed-off-by: Denis barbaron <denis.barbaron@orange.com>
2026-04-17 15:43:25 +02:00 · 2024-12-04 17:01:23 +01:00
parent 872b0bcbd8
commit 3f76eea17f
9 changed files with 92 additions and 86 deletions
--- a/bower.json
+++ b/bower.json
@@ -1,6 +1,6 @@
 {
  "name": "stf",
-  "version": "0.1.0",
+  "version": "0.1.1",
  "dependencies": {
    "angular": "~1.8.3",
    "angular-animate": "~1.8.3",
@@ -16,7 +16,7 @@
    "angular-sanitize": "~1.8.3",
    "angular-touch": "~1.8.3",
    "angular-ui-ace": "~0.2.3",
-    "angular-ui-bootstrap": "~1.1.2",
+    "angular-ui-bootstrap": "~2.5.6",
    "angular-xeditable": "~0.10.2",
    "bootstrap": "~3.4.1",
    "components-font-awesome": "~4.7.0",
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -1,5 +1,5 @@
 //
-// Copyright © 2022 contains code contributed by Orange SA, authors: Denis Barbaron - Licensed under the Apache license 2.0
+// Copyright © 2022-2024 contains code contributed by Orange SA, authors: Denis Barbaron - Licensed under the Apache license 2.0
 //

 var path = require('path')
@@ -10,7 +10,6 @@ var jsonlint = require('gulp-jsonlint')
 var eslint = require('gulp-eslint')
 var EslintCLIEngine = require('eslint').CLIEngine
 var webpack = require('webpack')
-var webpackConfig = require('./webpack.config').webpack
 var webpackStatusConfig = require('./res/common/status/webpack.config')
 var gettext = require('gulp-angular-gettext')
 var pug = require('gulp-pug')
@@ -146,15 +145,7 @@ function fromString(filename, string) {

 // For production
 gulp.task('webpack:build', function(callback) {
-  var myConfig = Object.create(webpackConfig)
-  myConfig.plugins = myConfig.plugins.concat(
-    new webpack.DefinePlugin({
-      'process.env': {
-        NODE_ENV: JSON.stringify('production')
-      }
-    })
-  )
-  myConfig.devtool = false
+  var myConfig = require('./webpack.config').webpack

  webpack(myConfig, function(err, stats) {
    if (err) {
--- a/lib/units/app/middleware/webpack.js
+++ b/lib/units/app/middleware/webpack.js
@@ -1,3 +1,7 @@
+//
+// Copyright © 2024 contains code contributed by Orange SA, authors: Denis Barbaron - Licensed under the Apache license 2.0
+//
+
 var path = require('path')
 var url = require('url')

@@ -69,9 +73,9 @@ module.exports = function(localOptions) {
    }
  }

-  compiler.plugin('done', doneListener)
-  compiler.plugin('invalid', invalidate)
-  compiler.plugin('compile', invalidate)
+  compiler.hooks.done.tap('done', doneListener)
+  compiler.hooks.invalid.tap('invalid', invalidate)
+  compiler.hooks.compile.tap('compile', invalidate)

  function bundle() {
    if (valid) {
--- a/package.json
+++ b/package.json
@@ -51,7 +51,7 @@
    "@node-saml/passport-saml": "^5.0.0",
    "@slack/web-api": "^7.7.0",
    "@targetprocess/swagger-tools": "^1.0.1",
-    "android-device-list": "^1.2.7",
+    "android-device-list": "^1.2.10",
    "autodesk-forks-swagger-express-mw": "^0.9.0",
    "aws-sdk": "^2.4.13",
    "basic-auth": "^1.0.3",
@@ -67,7 +67,7 @@
    "express": "^4.21.1",
    "express-validator": "^7.2.0",
    "file-saver": "1.3.3",
-    "formidable": "^1.2.0",
+    "formidable": "^1.2.6",
    "gm": "^1.25.0",
    "hipchatter": "^0.3.1",
    "http-proxy": "^1.18.1",
@@ -77,9 +77,8 @@
    "lodash": "^4.17.21",
    "machinepack-http": "^9.0.0",
    "markdown-serve": "^0.9.0",
-    "mime": "^1.3.4",
-    "minimatch": "^3.0.3",
-    "module-alias": "^2.2.3",
+    "mime": "^1.6.0",
+    "minimatch": "^3.1.2",
    "my-local-ip": "^1.0.0",
    "openid": "^2.0.1",
    "passport": "^0.6.0",
@@ -90,8 +89,8 @@
    "request-progress": "^2.0.1",
    "rethinkdb": "^2.0.2",
    "semver": "^7.3.5",
-    "serve-favicon": "^2.2.0",
-    "serve-static": "^1.9.2",
+    "serve-favicon": "^2.5.0",
+    "serve-static": "^1.15.0",
    "socket.io": "^4.8.1",
    "socket.io-client": "^4.8.1",
    "split": "^1.0.0",
@@ -126,12 +125,13 @@
    "async": "^2.0.1",
    "bower": "^1.8.14",
    "chai": "^3.4.1",
-    "css-loader": "^0.28.11",
+    "consolidate": "^0.14.5",
+    "css-loader": "^3.6.0",
    "del": "^2.0.1",
    "eslint": "^4.19.1",
    "event-stream": "^3.3.2",
-    "exports-loader": "^0.7.0",
-    "file-loader": "^0.9.0",
+    "exports-loader": "^1.1.1",
+    "file-loader": "^6.2.0",
    "fs-extra": "^8.1.0",
    "gulp": "^4.0.2",
    "gulp-angular-gettext": "^2.1.0",
@@ -141,12 +141,11 @@
    "gulp-pug": "^4.0.1",
    "gulp-run": "^1.6.12",
    "gulp-util": "^3.0.7",
-    "html-loader": "^0.5.5",
+    "html-loader": "^1.3.2",
    "http-https": "^1.0.0",
-    "imports-loader": "^0.8.0",
+    "imports-loader": "^1.2.0",
    "jasmine-core": "^2.4.1",
    "jasmine-reporters": "^2.3.2",
-    "json-loader": "^0.5.4",
    "karma": "^2.0.2",
    "karma-chrome-launcher": "^3.1.0",
    "karma-firefox-launcher": "^1.0.0",
@@ -156,9 +155,9 @@
    "karma-opera-launcher": "^1.0.0",
    "karma-phantomjs-launcher": "^1.0.0",
    "karma-safari-launcher": "^1.0.0",
-    "karma-webpack": "^3.0.5",
-    "less": "^2.4.0",
-    "less-loader": "^2.2.2",
+    "karma-webpack": "^4.0.2",
+    "less": "^4.1.3",
+    "less-loader": "^6.0.0",
    "memory-fs": "^0.3.0",
    "node-libs-browser": "^1.0.0",
    "phantomjs-prebuilt": "^2.1.11",
@@ -171,11 +170,11 @@
    "sinon": "^1.17.2",
    "sinon-chai": "^2.7.0",
    "style-loader": "^0.23.1",
-    "template-html-loader": "^0.0.4",
+    "template-html-loader": "^1.0.0",
    "then-jade": "^2.4.1",
-    "url-loader": "^0.6.2",
-    "webpack": "^3.1.0",
-    "webpack-dev-server": "^2.11.5"
+    "url-loader": "^4.1.1",
+    "webpack": "^4.47.0",
+    "webpack-dev-server": "^3.11.3"
  },
  "engines": {
    "node": ">= 18.20.5"
--- a/res/app/control-panes/dashboard/navigation/navigation-controller.js
+++ b/res/app/control-panes/dashboard/navigation/navigation-controller.js
@@ -1,3 +1,7 @@
+//
+// Copyright © 2024 contains code contributed by Orange SA, authors: Denis Barbaron - Licensed under the Apache license 2.0
+//
+
 var _ = require('lodash')

 module.exports = function NavigationCtrl($scope, $rootScope) {
@@ -11,7 +15,7 @@ module.exports = function NavigationCtrl($scope, $rootScope) {
  }

  function resetFavicon() {
-    $scope.urlFavicon = require('./default-favicon.png')
+    $scope.urlFavicon = require('./default-favicon.png').default
    faviconIsSet = false
  }

--- a/res/app/views/index.pug
+++ b/res/app/views/index.pug
@@ -1,3 +1,7 @@
+//
+  Copyright © 2024 contains code contributed by Orange SA, authors: Denis Barbaron - Licensed under the Apache license 2.0
+//
+
 doctype html
 html(ng-app='app')
  head
@@ -27,5 +31,4 @@ html(ng-app='app')
          div(ng-view).fill-height

    script(src='/app/api/v1/state.js')
-    script(src='static/app/build/entry/commons.entry.js')
    script(src='static/app/build/entry/app.entry.js')
--- a/res/auth/ldap/views/index.pug
+++ b/res/auth/ldap/views/index.pug
@@ -1,3 +1,7 @@
+//
+  Copyright © 2024 contains code contributed by Orange SA, authors: Denis Barbaron - Licensed under the Apache license 2.0
+//
+
 doctype html
 html(ng-app='app')
  head
@@ -7,5 +11,4 @@ html(ng-app='app')
    meta(name='viewport', content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui')
  body(ng-cloak)
    div(ng-view)
-    script(src='static/app/build/entry/commons.entry.js')
    script(src='static/app/build/entry/authldap.entry.js')
--- a/res/auth/mock/views/index.pug
+++ b/res/auth/mock/views/index.pug
@@ -1,3 +1,7 @@
+//
+  Copyright © 2024 contains code contributed by Orange SA, authors: Denis Barbaron - Licensed under the Apache license 2.0
+//
+
 doctype html
 html(ng-app='app')
  head
@@ -7,5 +11,4 @@ html(ng-app='app')
    meta(name='viewport', content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui')
  body(ng-cloak)
    div(ng-view)
-    script(src='static/app/build/entry/commons.entry.js')
    script(src='static/app/build/entry/authmock.entry.js')
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,5 +1,5 @@
 //
-// Copyright © 2022 contains code contributed by Orange SA, authors: Denis Barbaron - Licensed under the Apache license 2.0
+// Copyright © 2022-2024 contains code contributed by Orange SA, authors: Denis Barbaron - Licensed under the Apache license 2.0
 //

 var _ = require('lodash')
@@ -10,7 +10,12 @@ var log = require('./lib/util/logger').createLogger('webpack:config')

 module.exports = {
  webpack: {
-    context: __dirname
+    mode: 'none'
+    , performance: {
+        hints: false
+      , maxAssetSize: 512000
+      }
+    , context: __dirname
    , cache: true
    , entry: {
        app: pathutil.resource('app/app.js')
@@ -34,59 +39,57 @@ module.exports = {
          , 'node_modules'
        ]
        , descriptionFiles: ['package.json', 'bower.json']
-        , moduleExtensions: ['-loader']
        , extensions: ['.js', '.json']
-        , enforceModuleExtension: false
        , alias: {
            'angular-bootstrap': 'angular-bootstrap/ui-bootstrap-tpls'
            , localforage: 'localforage/dist/localforage.js'
-            , 'socket.io': 'socket.io-client'
            , stats: 'stats.js/src/Stats.js'
            , 'underscore.string': 'underscore.string/index'
        }
    }
    , module: {
-        loaders: [
-          {test: /\.css$/, loader: 'style-loader!css-loader'}
-          , {test: /\.scss$/, loader: 'style-loader!css-loader!sass-loader'}
-          , {test: /\.less$/, loader: 'style-loader!css-loader!less-loader'}
-          , {test: /\.json$/, loader: 'json-loader'}
-          , {test: /\.jpg$/, loader: 'url-loader?limit=1000&mimetype=image/jpeg'}
-          , {test: /\.png$/, loader: 'url-loader?limit=1000&mimetype=image/png'}
-          , {test: /\.gif$/, loader: 'url-loader?limit=1000&mimetype=image/gif'}
-          , {test: /\.svg/, loader: 'url-loader?limit=1&mimetype=image/svg+xml'}
-          , {test: /\.woff/, loader: 'url-loader?limit=1&mimetype=application/font-woff'}
-          , {test: /\.otf/, loader: 'url-loader?limit=1&mimetype=application/font-woff'}
-          , {test: /\.ttf/, loader: 'url-loader?limit=1&mimetype=application/font-woff'}
-          , {test: /\.eot/, loader: 'url-loader?limit=1&mimetype=vnd.ms-fontobject'}
-          , {test: /\.pug$/, loader: 'template-html-loader?engine=jade'}
-          , {test: /\.html$/, loader: 'html-loader'}
-          , {test: /angular\.js$/, loader: 'exports-loader?angular'}
-          , {test: /angular-cookies\.js$/, loader: 'imports-loader?angular=angular'}
-          , {test: /angular-route\.js$/, loader: 'imports-loader?angular=angular'}
-          , {test: /angular-touch\.js$/, loader: 'imports-loader?angular=angular'}
-          , {test: /angular-animate\.js$/, loader: 'imports-loader?angular=angular'}
-          , {test: /angular-growl\.js$/, loader: 'imports-loader?angular=angular'}
-          , {test: /dialogs\.js$/, loader: 'script-loader'}
+        rules: [
+          {test: /\.css$/i, use: ['style-loader', 'css-loader']}
+          , {test: /\.scss$/i, use: ['style-loader', 'css-loader', 'sass-loader']}
+          , {test: /\.less$/i, use: ['style-loader', 'css-loader', 'less-loader']}
+          , {test: /\.(jpg|png|gif)$/i, use: [{loader: 'url-loader', options: {limit: 1000}}]}
+          , {test: /\.svg/i
+            , use: [{loader: 'url-loader', options: {limit: 1, mimetype: 'image/svg+xml'}}]}
+          , {test: /\.eot$/i
+            , use: [{loader: 'url-loader', options: {limit: 1, mimetype: 'vnd.ms-fontobject'}}]}
+          , {test: /\.(woff|otf|ttf)/i
+            , use: [{loader: 'url-loader', options: {limit: '1', mimetype: 'vnd.ms-fontobject'}}]}
+          , {test: /\.pug$/i
+            , use: [{loader: 'template-html-loader', options: {engine: 'jade'}}]}
+          , {test: /\.html$/i, loader: 'html-loader'}
+          , {test: /angular\.js$/i
+            , use: [{loader: 'exports-loader', options: {type: 'commonjs', exports: 'angular'}}]}
+          , {test: /angular-cookies\.js$/i
+            , use: [{loader: 'imports-loader', options: {imports: 'angular'}}]}
+          , {test: /angular-route\.js$/i
+            , use: [{loader: 'imports-loader', options: {imports: 'angular'}}]}
+          , {test: /angular-touch\.js$/i
+            , use: [{loader: 'imports-loader', options: {imports: 'angular'}}]}
+          , {test: /angular-animate\.js$/i
+            , use: [{loader: 'imports-loader', options: {imports: 'angular'}}]}
+          , {test: /angular-growl\.js$/i
+            , use: [{loader: 'imports-loader', options: {imports: 'angular'}}]}
+          , {test: /dialogs\.js$/, use: [{loader: 'script-loader'}]}
        ]
    }
    , plugins: [
-        new webpack.optimize.CommonsChunkPlugin({
-          name: 'commons.entry'
-          , filename: 'entry/commons.entry.js'
-        })
-        , new ProgressPlugin(_.throttle(
-            function(progress, message) {
-              var msg
-              if (message) {
-                msg = message
-              }
-              else {
-                msg = progress >= 1 ? 'complete' : 'unknown'
-              }
-              log.info('Build progress %d%% (%s)', Math.floor(progress * 100), msg)
+        new ProgressPlugin(_.throttle(
+          function(progress, message) {
+            var msg
+            if (message) {
+              msg = message
            }
-            , 1000
+            else {
+              msg = progress >= 1 ? 'complete' : 'unknown'
+            }
+            log.info('Build progress %d%% (%s)', Math.floor(progress * 100), msg)
+          }
+          , 1000
        ))
    ]
  }
@@ -95,10 +98,6 @@ module.exports = {
        new webpack.LoaderOptionsPlugin({
          debug: true
        })
-        , new webpack.optimize.CommonsChunkPlugin({
-            name: 'commons.entry'
-            , filename: 'entry/commons.entry.js'
-        })
      ]
      , devtool: 'eval'
      , stats: {