@elliemae/pui-cli 6.0.0-beta.15 → 6.0.0-beta.19

package/lib/server/index.js

@@ -60,21 +60,6 @@ const customHost = argv.host || process.env.HOST;
 const host = customHost || null; // Let http.Server use its default IPv6/4 host
 const prettyHost = customHost || 'localhost';
 
-const serveCompressedAssets = (req, res, next) => {
-  if (req.header('Accept-Encoding').includes('br')) {
-    req.url += '.br';
-    res.set('Content-Encoding', 'br');
-  } else {
-    req.url += '.gz';
-    res.set('Content-Encoding', 'gzip');
-  }
-  next();
-};
-
-// use the compressed bundle
-app.get('*.js', serveCompressedAssets);
-app.get('*.css', serveCompressedAssets);
-
 // Start your app.
 app.listen(port, host, async (err) => {
   if (err) {

package/lib/server/middlewares/addDevMiddlewares.js

@@ -1,5 +1,5 @@
 const webpack = require('webpack');
-const express = require('express');
+const expressStaticGzip = require('express-static-gzip');
 const webpackDevMiddleware = require('webpack-dev-middleware');
 const webpackHotMiddleware = require('webpack-hot-middleware');
 const { sendFileWithCSPNonce } = require('../csp');
@@ -25,7 +25,7 @@ module.exports = function addDevMiddlewares(app, webpackConfig) {
       heartbeat: 10 * 1000,
     }),
   );
-  app.use(express.static('cdn'));
+  app.use(expressStaticGzip('cdn'));
 
   const { outputFileSystem } = (middleware || {}).context || {};
 

package/lib/server/middlewares/addProdMiddlewares.js

@@ -1,6 +1,6 @@
 const path = require('path');
-const express = require('express');
 const compression = require('compression');
+const expressStaticGzip = require('express-static-gzip');
 const { sendFileWithCSPNonce } = require('../csp');
 
 module.exports = function addProdMiddlewares(app, options) {
@@ -17,8 +17,15 @@ module.exports = function addProdMiddlewares(app, options) {
     sendFileWithCSPNonce({ outputPath, res });
   });
 
-  app.use(publicPath, express.static(outputPath, { index: false }));
-  app.use(express.static('cdn'));
+  app.use(
+    publicPath,
+    expressStaticGzip(outputPath, {
+      index: false,
+      enableBrotli: true,
+      orderPreference: ['br'],
+    }),
+  );
+  app.use(expressStaticGzip('cdn'));
 
   app.get('*', (req, res) => sendFileWithCSPNonce({ outputPath, res }));
 };

package/lib/webpack/helpers.js

@@ -77,7 +77,6 @@ const getAlias = () =>
       'redux-saga',
       'moment',
       'lodash',
-      'connected-react-router',
       'styled-components',
       'immer',
       'react-dates',
@@ -188,7 +187,7 @@ const isGoogleTagManagerEnabled = () => {
 
 const getCompressionPlugins = () => {
   const commonConfig = {
-    test: /\.(js|css|html|svg)$/,
+    test: /\.(js|css)$/,
     exclude: [
       /\/adrum-ext/,
       /\/emuiUserMonitoring/,

package/lib/webpack/webpack.base.babel.js

@@ -7,6 +7,7 @@ const DuplicatePackageCheckerPlugin = require('duplicate-package-checker-webpack
 const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin');
 const MomentLocalesPlugin = require('moment-locales-webpack-plugin');
 const { WebpackManifestPlugin } = require('webpack-manifest-plugin');
+const FaviconsWebpackPlugin = require('favicons-webpack-plugin');
 const { ProvidePlugin } = require('webpack');
 
 const {
@@ -18,7 +19,6 @@ const {
 } = require('./helpers');
 const { ESBUILD_TARGET } = require('../esbuild');
 
-// get the application configuration
 const minicssLoader = {
   loader: MiniCssExtractPlugin.loader,
   options: {},
@@ -31,9 +31,6 @@ const postcssPlugins = [PostcssPresetEnv({ autoprefixer: { grid: true } })];
 const { buildPath, publicPath } = getPaths();
 
 const plugins = [
-  // Always expose NODE_ENV to webpack, in order to use `process.env.NODE_ENV`
-  // inside your code for any environment checks; Terser will automatically
-  // drop any unreachable code.
   new webpack.EnvironmentPlugin({
     NODE_ENV: 'development',
     ASSET_PATH: '/',
@@ -44,7 +41,6 @@ const plugins = [
     APP_CONFIG: getAppConfig(),
   }),
   new CaseSensitivePathsPlugin(),
-  // new ESLintPlugin(),
   new ProvidePlugin({
     React: 'react',
   }),
@@ -104,6 +100,17 @@ const plugins = [
   new DuplicatePackageCheckerPlugin(),
   new MomentLocalesPlugin(),
   new WebpackManifestPlugin(),
+  new FaviconsWebpackPlugin({
+    logo: './app/view/images/favicon.png',
+    favicons: {
+      developerName: 'ICE MT',
+      developerURL: null, // prevent retrieving from the nearest package.json
+      icons: {
+        coast: false,
+        yandex: false,
+      },
+    },
+  }),
 ];
 
 module.exports = (options) => ({
@@ -111,7 +118,6 @@ module.exports = (options) => ({
   entry: options.entry,
   output: {
     clean: true,
-    // Compile into js/build.js
     path: buildPath,
     publicPath,
     ...options.output,
@@ -120,22 +126,7 @@ module.exports = (options) => ({
   module: {
     rules: [
       {
-        test: /\.(jpe?g|png|gif|svg|ico)$/,
-        use: [
-          'file-loader',
-          {
-            loader: 'image-webpack-loader',
-            options: {
-              gifsicle: {
-                enabled: false,
-              },
-            },
-          },
-        ],
-        enforce: 'pre',
-      },
-      {
-        test: /\.(js|ts|jsx|tsx)$/,
+        test: /\.[jt]sx?$/,
         enforce: 'pre',
         exclude: /node_modules/,
         resolve: {
@@ -152,7 +143,7 @@ module.exports = (options) => ({
         ],
       },
       {
-        test: /\.(js|jsx)$/,
+        test: /\.[j]sx?$/,
         exclude: excludeNodeModulesExcept(modulesToTranspile),
         resolve: {
           fullySpecified: false,
@@ -166,7 +157,7 @@ module.exports = (options) => ({
         },
       },
       {
-        test: /\.(ts|tsx)$/,
+        test: /\.[t]sx?$/,
         exclude: excludeNodeModulesExcept(modulesToTranspile),
         resolve: {
           fullySpecified: false,
@@ -213,22 +204,13 @@ module.exports = (options) => ({
         exclude: excludeNodeModulesExcept(['@elliemae/*']),
         type: 'asset/resource',
       },
-      {
-        type: 'asset',
-        resourceQuery: /url/, // *.svg?react
-      },
       {
         test: /\.svg$/i,
         issuer: /\.[jt]sx?$/,
         use: ['@svgr/webpack'],
       },
       {
-        test: /\.(jpe?g|png|gif|ico)$/i,
-        exclude: excludeNodeModulesExcept(['@elliemae/*']),
-        type: 'asset',
-      },
-      {
-        test: /\.(mp4|webm)$/,
+        test: /\.(jpe?g|png|gif|ico|mp4|webm)$/i,
         exclude: excludeNodeModulesExcept(['@elliemae/*']),
         type: 'asset',
       },
@@ -236,6 +218,10 @@ module.exports = (options) => ({
         resourceQuery: /resource/,
         type: 'asset/resource',
       },
+      {
+        type: 'asset',
+        resourceQuery: /url/,
+      },
     ],
   },
   plugins: plugins.concat(options.plugins),
@@ -244,7 +230,6 @@ module.exports = (options) => ({
     extensions: ['.wasm', '.mjs', '.ts', '.tsx', '.js', '.jsx', '.json'],
     mainFields: ['browser', 'module', 'main'],
     alias: {
-      'lodash-es': 'lodash',
       ...getAlias(),
       ...((options.resolve || {}).alias || {}),
     },

package/lib/webpack/webpack.lib.base.babel.js

@@ -73,21 +73,6 @@ module.exports = (options) => ({
   optimization: options.optimization,
   module: {
     rules: [
-      {
-        test: /\.(jpe?g|png|gif|svg|ico)$/,
-        use: [
-          'file-loader',
-          {
-            loader: 'image-webpack-loader',
-            options: {
-              gifsicle: {
-                enabled: false,
-              },
-            },
-          },
-        ],
-        enforce: 'pre',
-      },
       {
         test: /^(?!.*\.exec\.js$).*\.(js|ts|jsx|tsx)$/,
         enforce: 'pre',

package/lib/webpack/webpack.storybook.js

@@ -43,7 +43,7 @@ const getAdditionalPlugins = () => [
   }),
 ];
 
-const getModulePreRules = () => [
+const getModuleRules = () => [
   {
     test: /\.(js|ts|jsx|tsx)$/,
     enforce: 'pre',
@@ -61,11 +61,24 @@ const getModulePreRules = () => [
       },
     ],
   },
+  {
+    type: 'asset',
+    resourceQuery: /url/,
+  },
+  {
+    test: /\.svg$/i,
+    issuer: /\.[jt]sx?$/,
+    use: ['@svgr/webpack'],
+  },
 ];
 
 exports.webpackFinal = async (config, { configType }) => {
   const isProd = configType === 'PRODUCTION';
-  config.module.rules.push(...getModulePreRules());
+  const fileLoaderRule = config.module.rules.find((rule) =>
+    rule.test?.test?.('.svg'),
+  );
+  fileLoaderRule.exclude = /\.svg$/i;
+  config.module.rules.unshift(...getModuleRules());
   config.plugins.push(...getAdditionalPlugins());
   if (isProd) {
     config.plugins = config.plugins.concat(getCompressionPlugins());
@@ -73,7 +86,7 @@ exports.webpackFinal = async (config, { configType }) => {
 
   config.resolve.alias = { ...config.resolve.alias, ...getAlias() };
   config.resolve.fallback = { ...config.resolve.fallback, crypto: false };
-
+  config.resolve.extensions.push('.svg');
   config.externals = config.externals || {};
   config.externals['@elliemae/pui-user-monitoring'] = 'emuiUserMonitoring';
   config.externals['@elliemae/pui-app-loader'] = 'emuiAppLoader';

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@elliemae/pui-cli",
-  "version": "6.0.0-beta.15",
+  "version": "6.0.0-beta.19",
   "private": false,
-  "description": "EllieMae Platform UI CLI",
+  "description": "ICE MT UI Platform CLI",
   "sideEffects": false,
   "main": "./lib/index.js",
   "module": "./lib/index.js",
@@ -20,10 +20,10 @@
     "url": "https://git.elliemae.io/platform-ui/pui-cli.git"
   },
   "engines": {
-    "npm": ">=7",
-    "node": ">=14"
+    "npm": ">=8",
+    "node": ">=16"
   },
-  "author": "Vinoth Kalyanasundaram",
+  "author": "ICE MT",
   "license": "MIT",
   "scripts": {
     "build": "exit 0",
@@ -128,6 +128,7 @@
     "esbuild": "~0.14.1",
     "esbuild-jest": "~0.5.0",
     "esbuild-loader": "~2.16.0",
+    "esbuild-plugin-svgr": "~0.0.3",
     "eslint": "~8.3.0",
     "eslint-config-airbnb": "~18.2.1",
     "eslint-config-airbnb-base": "~15.0.0",
@@ -151,9 +152,12 @@
     "eslint-plugin-storybook": "~0.5.2",
     "eslint-plugin-testing-library": "~5.0.1",
     "eslint-plugin-wdio": "~7.4.2",
+    "express-static-gzip": "~2.1.1",
     "execa": "~5.1.1",
     "express": "~4.17.1",
     "express-pino-logger": "~7.0.0",
+    "favicons": "~6.2.2",
+    "favicons-webpack-plugin": "~5.0.2",
     "file-loader": "~6.2.0",
     "fork-ts-checker-webpack-plugin": "~6.5.0",
     "helmet-csp": "~3.4.0",
@@ -162,7 +166,6 @@
     "http-server": "~14.0.0",
     "husky": "~7.0.4",
     "husky-init": "~7.0.0",
-    "image-webpack-loader": "~8.0.1",
     "imports-loader": "~3.1.1",
     "ip": "~1.1.5",
     "jest-axe": "~5.0.1",
@@ -240,7 +243,7 @@
     "webpack-pwa-manifest": "~4.3.0",
     "webpack-strip-block": "~0.3.0",
     "whatwg-fetch": "~3.6.2",
-    "workbox-webpack-plugin": "~6.4.1",
+    "workbox-webpack-plugin": "~6.4.2",
     "yargs": "~17.3.0"
   },
   "devDependencies": {