@oroinc/oro-webpack-config-builder 6.1.0-lts08 → 6.1.0-lts10

package/oro-webpack-config.js

@@ -9,6 +9,8 @@ const EntryPointFileWriter = require('./writer/scss-entry-point-file-writer');
 const LayoutModulesConfigLoader = require('./modules-config/layout-modules-config-loader');
 const LayoutStyleLoader = require('./style/layout-style-loader');
 const MapModulesPlugin = require('./plugin/map/map-modules-plugin');
+const IntegrityFilePlugin = require('./plugin/integrity/integrity-file-plugin');
+const {SubresourceIntegrityPlugin} = require('webpack-subresource-integrity');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 const ModulesConfigLoader = require('./modules-config/modules-config-loader');
 const DynamicImportsFileWriter = require('./writer/dynamic-imports-file-writer');
@@ -283,7 +285,8 @@ class ConfigBuilder {
             output: {
                 filename: '[name].js',
                 // Because we use third party libraries 'chunkFilename' should include only [name]
-                chunkFilename: this._getVersionedPath('chunk/[name].js', this.assetVersion)
+                chunkFilename: this._getVersionedPath('chunk/[name].js', this.assetVersion),
+                crossOriginLoading: 'anonymous'
             },
             devtool: !env.skipSourcemap && 'inline-cheap-module-source-map',
             mode: 'development',
@@ -322,7 +325,7 @@ class ConfigBuilder {
                 ],
                 rules: [
                     {
-                        test: /\.(eot|ttf|woff|woff2|cur|ico|svg|png|jpg|gif)$/,
+                        test: /\.(eot|ttf|woff|woff2|cur|ico|svg|png|jpg|gif|webp)$/,
                         loader: 'url-loader',
                         options: {
                             limit: 1,
@@ -352,6 +355,10 @@ class ConfigBuilder {
                 new webpack.optimize.MinChunkSizePlugin({
                     minChunkSize: 30000 // Minimum number of characters
                 }),
+                new SubresourceIntegrityPlugin(),
+                new IntegrityFilePlugin({
+                    publicPath: this.resolvedPublicPath
+                }),
                 new AfterWebpackLogsPlugin(
                     stats => this.emitter.emit('build:complete', stats)
                 )

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oroinc/oro-webpack-config-builder",
-  "version": "6.1.0-lts08",
+  "version": "6.1.0-lts10",
   "author": "Oro, Inc. (https://oroinc.com)",
   "license": "MIT",
   "description": "An integration of OroPlatform based applications with the Webpack.",
@@ -49,6 +49,7 @@
     "webpack-cli": "~6.0.0",
     "webpack-dev-server": "^5.2.0",
     "webpack-merge": "~5.8.0",
+    "webpack-subresource-integrity": "^5.2.0-rc.1",
     "wildcard": "~2.0.0"
   }
 }

package/plugin/integrity/integrity-file-plugin.js

@@ -0,0 +1,42 @@
+const { createHash } = require('crypto');
+const { Compilation, sources } = require('webpack');
+const fs = require('fs').promises;
+const path = require('path');
+
+class IntegrityFilePlugin {
+    constructor({fileName = 'integrity.json', publicPath = '', algorithm = 'sha384'} = {}) {
+        this.fileName = fileName;
+        this.publicPath = publicPath;
+        this.algorithm = algorithm;
+    }
+
+    apply(compiler) {
+        compiler.hooks.thisCompilation.tap('IntegrityFilePlugin', (compilation) => {
+            compilation.hooks.processAssets.tapPromise(
+                { name: 'SubresourceIntegrityPlugin', stage: Compilation.PROCESS_ASSETS_STAGE_OPTIMIZE_TRANSFER },
+                async () => {
+                    const integrityData = Object.fromEntries(
+                        Object.entries(compilation.assets)
+                            .filter(([assetName]) => assetName.endsWith('.css') || assetName.endsWith('.js'))
+                            .map(([assetName, asset]) => {
+                            const hash = createHash(this.algorithm).update(asset.source()).digest('base64');
+                            const assetNormalized = assetName.split('?')[0];
+
+                            return [
+                                path.join(compiler.options.output.publicPath || '', assetNormalized),
+                                `${this.algorithm}-${hash}`
+                            ];
+                        })
+                    );
+                    const jsonData = JSON.stringify(integrityData, null, 2);
+                    const outputPath = path.join(this.publicPath, compiler.options.output.publicPath, this.fileName);
+
+                    await fs.writeFile(outputPath, jsonData, 'utf8');
+                    compilation.emitAsset(outputPath, new sources.RawSource(jsonData));
+                }
+            );
+        });
+    }
+}
+
+module.exports = IntegrityFilePlugin;

package/validation/errors/theme-scheme-error.js

@@ -3,16 +3,16 @@ const BaseError = require('./base-error');
 class SvgIconsSchemaError extends BaseError {
     /**
      * @example
-     * Invalid SVG config: the "svg-icons.yml" files in the "default" theme do not match the API schema.
+     * Invalid Theme config: the "theme.yml" files in the "default" theme do not match the API schema.
      * has an unknown property 'rest'.
-     * at default/config/svg-icons.yml
+     * at default/theme.yml
      *
      * @example
-     * Invalid SVG config: the "svg-icons.yml" files in the "default" theme do not match the API schema.
-     * misses the property 'exclude'.
+     * Invalid Theme config: the "theme.yml" files in the "default" theme do not match the API schema.
+     * misses the property 'label'.
      * List of processed files for the "default" theme:
-     *     /default/config/svg-icons.yml
-     *     /default/config/svg-icons.yml
+     *     /default/theme.yml
+     *     /default/theme.yml
      *
      * @param {string} reason
      * @param {Array} files