testing

apps/remix-ide/___webpack.config.js

@@ -0,0 +1,83 @@
+const nxWebpack = require('@nrwl/react/plugins/webpack')
+const CopyPlugin = require("copy-webpack-plugin");
+const webpack = require('webpack')
+const version = require('../../package.json').version
+const fs = require('fs')
+const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
+
+const versionData = {
+  version: version,
+  timestamp: Date.now(),
+  mode: process.env.NODE_ENV === 'production' ? 'production' : 'development'
+}
+
+fs.writeFileSync('./apps/remix-ide/src/assets/version.json', JSON.stringify(versionData))
+
+module.exports = config => {
+  const nxWebpackConfig = nxWebpack(config)
+  const webpackConfig = {
+    ...nxWebpackConfig,
+    resolve: {
+      ...nxWebpackConfig.resolve,
+      fallback: {
+        ...nxWebpackConfig.resolve.fallback,
+        "crypto": require.resolve("crypto-browserify"),
+        "stream": require.resolve("stream-browserify"),
+        "path": require.resolve("path-browserify"),
+        "http": require.resolve("stream-http"),
+        "https": require.resolve("https-browserify"),
+        "constants": require.resolve("constants-browserify"),
+        "os": false, //require.resolve("os-browserify/browser"),
+        "timers": false, // require.resolve("timers-browserify"),
+        "zlib": require.resolve("browserify-zlib"),
+        "fs": false,
+        "module": false,
+        "tls": false,
+        "net": false,
+        "readline": false,
+        "child_process": false,
+        "buffer": require.resolve("buffer/"),
+        "vm": require.resolve('vm-browserify'),
+      },
+    },
+    externals: {
+      ...nxWebpackConfig.externals,
+      solc: 'solc',
+    },
+
+    output: {
+      ...nxWebpackConfig.output,
+      publicPath: '/',
+      filename: `[name].${versionData.version}.${versionData.timestamp}.js`,
+      chunkFilename: `[name].${versionData.version}.${versionData.timestamp}.js`,
+    },
+    plugins: [
+      ...nxWebpackConfig.plugins,
+      //new BundleAnalyzerPlugin({
+      //  analyzerMode: 'static'
+      //}),
+      new CopyPlugin({
+        patterns: [
+          { from: '../../node_modules/monaco-editor/dev/vs', to: 'assets/js/monaco-editor/dev/vs' }
+        ].filter(Boolean)
+      }),
+      new webpack.ProvidePlugin({
+        Buffer: ['buffer', 'Buffer'],
+        url: ['url', 'URL'],
+        process: 'process/browser',
+      }),
+    ]
+  }
+
+  webpackConfig.output.chunkLoadTimeout = 600000
+
+  if (process.env.NODE_ENV === 'production') {
+    return {
+      ...webpackConfig,
+      mode: 'production',
+      devtool: 'source-map',
+    }
+  } else {
+    return webpackConfig
+  }
+}

apps/remix-ide/project.json

@@ -30,14 +30,18 @@
       },
       "configurations": {
         "development": {
+          "extractLicenses": false,
+          "sourceMap": false,
+          "vendorChunk": true,
+          "optimization": false
         },
         "production": {
-          "fileReplacements": [
+          "optimization": true,
-            {
+          "outputHashing": "all",
-              "replace": "apps/remix-ide/src/environments/environment.ts",
+          "sourceMap": false,
-              "with": "apps/remix-ide/src/environments/environment.prod.ts"
+          "namedChunks": false,
-            }
+          "extractLicenses": false,
-          ]
+          "vendorChunk": false
         }
       }
     },

apps/remix-ide/webpack.config.js

@@ -1,9 +1,10 @@
-const nxWebpack = require('@nrwl/react/plugins/webpack')
+const { composePlugins, withNx } = require('@nrwl/webpack');
-const CopyPlugin = require("copy-webpack-plugin");
+const { withReact } = require('@nrwl/react');
 const webpack = require('webpack')
+const CopyPlugin = require("copy-webpack-plugin");
 const version = require('../../package.json').version
 const fs = require('fs')
-const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
+const TerserPlugin = require("terser-webpack-plugin");
 
 const versionData = {
   version: version,
@@ -13,71 +14,80 @@ const versionData = {
 
 fs.writeFileSync('./apps/remix-ide/src/assets/version.json', JSON.stringify(versionData))
 
-module.exports = config => {
+// Nx plugins for webpack.
-  const nxWebpackConfig = nxWebpack(config)
+module.exports = composePlugins(withNx(), withReact(), (config) => {
-  const webpackConfig = {
+  // Update the webpack config as needed here.
-    ...nxWebpackConfig,
+  // e.g. `config.plugins.push(new MyPlugin())`
-    resolve: {
-      ...nxWebpackConfig.resolve,
-      fallback: {
-        ...nxWebpackConfig.resolve.fallback,
-        "crypto": require.resolve("crypto-browserify"),
-        "stream": require.resolve("stream-browserify"),
-        "path": require.resolve("path-browserify"),
-        "http": require.resolve("stream-http"),
-        "https": require.resolve("https-browserify"),
-        "constants": require.resolve("constants-browserify"),
-        "os": false, //require.resolve("os-browserify/browser"),
-        "timers": false, // require.resolve("timers-browserify"),
-        "zlib": require.resolve("browserify-zlib"),
-        "fs": false,
-        "module": false,
-        "tls": false,
-        "net": false,
-        "readline": false,
-        "child_process": false,
-        "buffer": require.resolve("buffer/"),
-        "vm": require.resolve('vm-browserify'),
-      },
-    },
-    externals: {
-      ...nxWebpackConfig.externals,
-      solc: 'solc',
-    },
 
-    output: {
+  // add fallback for node modules
-      ...nxWebpackConfig.output,
+  config.resolve.fallback = {
-      publicPath: '/',
+    ...config.resolve.fallback,
-      filename: `[name].${versionData.version}.${versionData.timestamp}.js`,
+    "crypto": require.resolve("crypto-browserify"),
-      chunkFilename: `[name].${versionData.version}.${versionData.timestamp}.js`,
+    "stream": require.resolve("stream-browserify"),
-    },
+    "path": require.resolve("path-browserify"),
-    plugins: [
+    "http": require.resolve("stream-http"),
-      ...nxWebpackConfig.plugins,
+    "https": require.resolve("https-browserify"),
-      //new BundleAnalyzerPlugin({
+    "constants": require.resolve("constants-browserify"),
-      //  analyzerMode: 'static'
+    "os": false, //require.resolve("os-browserify/browser"),
-      //}),
+    "timers": false, // require.resolve("timers-browserify"),
-      new CopyPlugin({
+    "zlib": require.resolve("browserify-zlib"),
-        patterns: [
+    "fs": false,
-          { from: '../../node_modules/monaco-editor/dev/vs', to: 'assets/js/monaco-editor/dev/vs' }
+    "module": false,
-        ].filter(Boolean)
+    "tls": false,
-      }),
+    "net": false,
-      new webpack.ProvidePlugin({
+    "readline": false,
-        Buffer: ['buffer', 'Buffer'],
+    "child_process": false,
-        url: ['url', 'URL'],
+    "buffer": require.resolve("buffer/"),
-        process: 'process/browser',
+    "vm": require.resolve('vm-browserify'),
-      }),
-    ]
   }
 
-  webpackConfig.output.chunkLoadTimeout = 600000
+  // add externals
-
+  config.externals = {
-  if (process.env.NODE_ENV === 'production') {
+    ...config.externals,
-    return {
+    solc: 'solc',
-      ...webpackConfig,
-      mode: 'production',
-      devtool: 'source-map',
-    }
-  } else {
-    return webpackConfig
   }
-}
+
+  // add public path
+  config.output.publicPath = '/'
+
+  // set filename
+  config.output.filename = `[name].${versionData.version}.${versionData.timestamp}.js`
+  config.output.chunkFilename = `[name].${versionData.version}.${versionData.timestamp}.js`
+
+  // add plugin
+  // add copy plugin
+  config.plugins.push(
+    new CopyPlugin({
+      patterns: [
+        { from: '../../node_modules/monaco-editor/dev/vs', to: 'assets/js/monaco-editor/dev/vs' }
+      ].filter(Boolean)
+    }),
+    new webpack.ProvidePlugin({
+      Buffer: ['buffer', 'Buffer'],
+      url: ['url', 'URL'],
+      process: 'process/browser',
+    })
+  )
+
+  // set minimizer
+  config.optimization.minimizer = [
+    new TerserPlugin({
+      parallel: true,
+      terserOptions: {
+        ecma: 6,
+        compress: {
+          drop_console: true,
+        },
+        output: {
+          comments: false,
+        },
+      },
+      extractComments: false,
+    }),
+  ];
+
+  console.log(config)
+
+
+  return config;
+});

package.json

@@ -221,17 +221,18 @@
     "@babel/preset-typescript": "^7.18.6",
     "@babel/register": "^7.4.4",
     "@fortawesome/fontawesome-free": "^5.8.1",
-    "@nrwl/cli": "^15.0.0",
+    "@nrwl/cli": "^15.6.3",
-    "@nrwl/eslint-plugin-nx": "^15.0.0",
+    "@nrwl/eslint-plugin-nx": "^15.6.3",
-    "@nrwl/jest": "15.0.0",
+    "@nrwl/jest": "15.6.3",
-    "@nrwl/js": "15.0.0",
+    "@nrwl/js": "15.6.3",
-    "@nrwl/linter": "15.0.0",
+    "@nrwl/linter": "15.6.3",
-    "@nrwl/node": "15.0.0",
+    "@nrwl/node": "15.6.3",
-    "@nrwl/react": "15.0.0",
+    "@nrwl/react": "15.6.3",
-    "@nrwl/tao": "^15.0.0",
+    "@nrwl/tao": "^15.6.3",
-    "@nrwl/web": "15.0.0",
+    "@nrwl/web": "15.6.3",
-    "@nrwl/webpack": "15.0.0",
+    "@nrwl/webpack": "15.6.3",
-    "@nrwl/workspace": "^15.0.0",
+    "@nrwl/workspace": "^15.6.3",
+    "@svgr/webpack": "^6.5.1",
     "@testing-library/react": "13.4.0",
     "@types/axios": "^0.14.0",
     "@types/chai": "^4.3.3",
@@ -323,7 +324,7 @@
     "npm-link-local": "^1.1.0",
     "npm-merge-driver": "^2.3.5",
     "npm-run-all": "^4.0.2",
-    "nx": "15.0.0",
+    "nx": "15.6.3",
     "nyc": "^13.3.0",
     "onchange": "^3.2.1",
     "os-browserify": "^0.3.0",
@@ -339,6 +340,7 @@
     "style-loader": "^3.3.1",
     "tap-spec": "^5.0.0",
     "tape": "^4.13.3",
+    "terser-webpack-plugin": "^5.3.6",
     "timers-browserify": "^2.0.12",
     "ts-jest": "^29.0.3",
     "ts-node": "10.9.1",