Improve css prebuilt creation and minimize (#5553)

* improve CSS creation strategy and minimize

* remove multiple select slow down test

lib/config/bundle-scss.js

@@ -1,23 +0,0 @@
-var Bundler = require('scss-bundle').Bundler;
-var writeFileSync = require('fs-extra').writeFileSync;
-var mkdirpSync = require('fs-extra').mkdirpSync;
-
- new Bundler().Bundle('./lib/core/styles/_index.scss', '**/*.scss').then(result => {
-    writeFileSync('./lib/dist/core/_theming.scss', result.bundledContent);
-});
-
- new Bundler().Bundle('./lib/insights/src/lib/styles/_index.scss', '**/*.scss').then(result => {
-    writeFileSync('./lib/dist/insights/_theming.scss', result.bundledContent);
-});
-
- new Bundler().Bundle('./lib/process-services/src/lib/styles/_index.scss', '**/*.scss').then(result => {
-    writeFileSync('./lib/dist/process-services/_theming.scss', result.bundledContent);
-});
-
- new Bundler().Bundle('./lib/content-services/src/lib/styles/_index.scss', '**/*.scss').then(result => {
-    writeFileSync('./lib/dist/content-services/_theming.scss', result.bundledContent);
-});
-
-new Bundler().Bundle('./lib/process-services-cloud/src/lib/styles/_index.scss', '**/*.scss').then(result => {
-    writeFileSync('./lib/dist/process-services-cloud/_theming.scss', result.bundledContent);
-});

lib/config/custom-loaders/file-loader-multi.js

@@ -1,70 +0,0 @@
-var path = require('path');
-var loaderUtils = require('loader-utils');
-
-module.exports = function(content) {
-    this.cacheable && this.cacheable();
-    if(!this.emitFile) throw new Error('emitFile is required from module system');
-
-    var query = loaderUtils.getOptions(this) || {};
-    var configKey = query.config || 'multiFileLoader';
-    var options = this.options[configKey] || {};
-    var config = {
-        publicPath: false,
-        useRelativePath: false,
-        name: '[hash].[ext]'
-    };
-
-    // options takes precedence over config
-    Object.keys(options).forEach(function(attr) {
-        config[attr] = options[attr];
-    });
-
-    // query takes precedence over config and options
-    Object.keys(query).forEach(function(attr) {
-        config[attr] = query[attr];
-    });
-
-    var context = config.context || this.options.context;
-    var url = loaderUtils.interpolateName(this, config.name, {
-        context: context,
-        content: content,
-        regExp: config.regExp
-    });
-    var path = loaderUtils.interpolateName(this, '[path]', {
-        context: context,
-        content: content,
-        regExp: config.regExp
-    });
-
-    var outputPath = '';
-
-    if (config.outputPath) {
-        outputPath = (
-            typeof config.outputPath === 'function'
-                ? config.outputPath(url, path)
-                : config.outputPath + url
-        );
-    } else {
-        outputPath = url;
-    }
-
-    var publicPath = JSON.stringify(url);
-
-    if (config.publicPath) {
-        publicPath = JSON.stringify(
-            typeof config.publicPath === 'function'
-                ? config.publicPath(url, path)
-                : config.publicPath + url
-        );
-    }
-
-    publicPath = '__webpack_public_path__ + ' + publicPath;
-
-    if (query.emitFile === undefined || query.emitFile) {
-        this.emitFile(outputPath, content);
-    }
-
-    return 'module.exports = ' + publicPath + ';';
-};
-
-module.exports.raw = true;

lib/config/webpack.style.js

@@ -1,12 +1,15 @@
-const ExtractTextPlugin = require("extract-text-webpack-plugin");
-
-const extractScss = new ExtractTextPlugin('./core/prebuilt-themes/[name].css');
-var path = require("path");
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+const path = require("path");
+const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
 
 module.exports = {
 
     mode: 'production',
 
+    optimization: {
+        minimizer: [new OptimizeCSSAssetsPlugin({})],
+    },
+
     entry: {
         'adf-blue-orange': './lib/core/styles/prebuilt/adf-blue-orange.scss',
         'adf-blue-purple': './lib/core/styles/prebuilt/adf-blue-purple.scss',
@@ -20,7 +23,7 @@ module.exports = {
     },
 
     output: {
-        path: path.resolve(__dirname, '../dist/'),
+        path: path.resolve(__dirname, '../dist/core/prebuilt-themes/'),
         filename: '[name].js',
         publicPath: '/dist'
     },
@@ -28,14 +31,8 @@ module.exports = {
     module: {
         rules: [{
             test: /\.scss$/,
-            use: extractScss.extract([{
-                loader: "raw-loader"
-            }, {
-                loader: "sass-loader"
-            }])
+            use: [MiniCssExtractPlugin.loader, "css-loader", "sass-loader"]
         }]
     },
-    plugins: [
-        extractScss
-    ]
+    plugins: [new MiniCssExtractPlugin()]
 };