From e89ebdfd4758ea6e977d447597629de9ea722c9f Mon Sep 17 00:00:00 2001 From: Caleb Shafer <31107829+calebmshafer@users.noreply.github.com> Date: Sun, 27 Jun 2021 22:08:27 -0400 Subject: [PATCH 1/5] Revert the default usage of the new asset copying workflow behind a flag --- packages/react-scripts/README-imodeljs.md | 17 +++++++++-------- packages/react-scripts/config/webpack.config.js | 6 +++++- 2 files changed, 14 insertions(+), 9 deletions(-) diff --git a/packages/react-scripts/README-imodeljs.md b/packages/react-scripts/README-imodeljs.md index e311cc39344..399e8364ff2 100644 --- a/packages/react-scripts/README-imodeljs.md +++ b/packages/react-scripts/README-imodeljs.md @@ -16,14 +16,15 @@ Current upstream with `react-scripts@3.4.1`. > Note: These configuration variables are an extension of the [Advanced Configurations](create-react-app.dev/docs/advanced-configuration) supported by create-react-app. - | Variable | Development | Production | Usage | - | ----------------------- | ----------- | ---------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | - | USE_FAST_SASS | ✅ Used | ✅ Used | When set to `true`, use the fast-sass-loader instead of sass-loader. This helps with long build times on smaller machines attempting to build an app with a large amount of scss/sass files. | - | DEBUG_BUILD_PERFORMANCE | ✅ Used | 🚫 Ignored | When set to `true`, reports webpack build performance and bottlenecks. Uses the [speed measure webpack plugin](https://www.npmjs.com/package/speed-measure-webpack-plugin). | - | USE_FULL_SOURCEMAP | ✅ Used | 🚫 Ignored | When set to `true`, the sourcemaps generated use 'source-map' instead of 'cheap-module-source-map'. This is known to cause out-of-memory errors but gives full fidelity source maps in debug builds. | - | DISABLE_ESLINT | ✅ Used | ✅ Used | When set to `true`, webpack will not run eslint at all. This can speedup builds when you want to keep build and lint as separate steps. | - | TRANSPILE_DEPS | ✅ Used | ✅ Used | When set to `false`, webpack will not run babel on anything in node_modules. Transpiling dependencies can be costly, and is often not necessary when targeting newer browsers. | - | DISABLE_TERSER | 🚫 Ignored | ✅ Used | When set to `true`, skips all minification. Useful for PR builds and test apps. | + | Variable | Development | Production | Usage | + | ----------------------- | ----------- | ---------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | + | USE_FAST_SASS | ✅ Used | ✅ Used | When set to `true`, use the fast-sass-loader instead of sass-loader. This helps with long build times on smaller machines attempting to build an app with a large amount of scss/sass files. | + | DEBUG_BUILD_PERFORMANCE | ✅ Used | 🚫 Ignored | When set to `true`, reports webpack build performance and bottlenecks. Uses the [speed measure webpack plugin](https://www.npmjs.com/package/speed-measure-webpack-plugin). | + | USE_FULL_SOURCEMAP | ✅ Used | 🚫 Ignored | When set to `true`, the sourcemaps generated use 'source-map' instead of 'cheap-module-source-map'. This is known to cause out-of-memory errors but gives full fidelity source maps in debug builds. | + | DISABLE_ESLINT | ✅ Used | ✅ Used | When set to `true`, webpack will not run eslint at all. This can speedup builds when you want to keep build and lint as separate steps. | + | TRANSPILE_DEPS | ✅ Used | ✅ Used | When set to `false`, webpack will not run babel on anything in node_modules. Transpiling dependencies can be costly, and is often not necessary when targeting newer browsers. | + | DISABLE_TERSER | 🚫 Ignored | ✅ Used | When set to `true`, skips all minification. Useful for PR builds and test apps. | + | USE_NEW_ASSET_COPY | ✅ Used | ✅ Used | When set to `true`, uses the new copy static assets workflow which copies all files from dependencies starting with `@bentley` or `@itwin` scope. In addition it would make them available to both a `build` and `start`. Note: There is a bug with the update when used in conjunction with pnpm or yarn workspaces. | - Typing changes diff --git a/packages/react-scripts/config/webpack.config.js b/packages/react-scripts/config/webpack.config.js index 17b5bcc7ea2..56083586837 100644 --- a/packages/react-scripts/config/webpack.config.js +++ b/packages/react-scripts/config/webpack.config.js @@ -66,6 +66,8 @@ const shouldTranspileDeps = process.env.TRANSPILE_DEPS !== 'false'; const shouldMinify = process.env.DISABLE_TERSER !== 'true'; +const useNewAssetCopy = process.env.USE_NEW_ASSET_COPY === 'true'; + // End iModel.js Changes block // Source maps are resource heavy and can cause out of memory issue for large source files. @@ -698,7 +700,9 @@ module.exports = function(webpackEnv) { // NOTE: iModel.js specific plugin to copy a set of static resources from the node_modules // directory of each dependent package into the 'build/public' directory. // Used for resources such as locales, which are defined by each consuming package. - new CopyStaticAssetsPlugin({}), + useNewAssetCopy + ? new CopyStaticAssetsPlugin({}) + : new CopyBentleyStaticResourcesPlugin(['public'], true), // NOTE: FilterWarningsPlugin is used to ignore warning coming from sourcemaps new FilterWarningsPlugin({ exclude: /Failed to parse source map/ }), From fcc5c51a5434c2602dd852c21fc099a0d0104964 Mon Sep 17 00:00:00 2001 From: Caleb Shafer <31107829+calebmshafer@users.noreply.github.com> Date: Sun, 27 Jun 2021 22:15:27 -0400 Subject: [PATCH 2/5] Bump version 3.4.13 and add missing import --- packages/react-scripts/config/webpack.config.js | 1 + packages/react-scripts/package.json | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/react-scripts/config/webpack.config.js b/packages/react-scripts/config/webpack.config.js index 56083586837..efc2d8d1595 100644 --- a/packages/react-scripts/config/webpack.config.js +++ b/packages/react-scripts/config/webpack.config.js @@ -46,6 +46,7 @@ const FilterWarningsPlugin = require('webpack-filter-warnings-plugin'); const { BanBackendImportsPlugin, + CopyBentleyStaticResourcesPlugin, CopyStaticAssetsPlugin, IModeljsLibraryExportsPlugin, } = require('@bentley/webpack-tools-core'); diff --git a/packages/react-scripts/package.json b/packages/react-scripts/package.json index b8ce484c5bc..8825e94636e 100644 --- a/packages/react-scripts/package.json +++ b/packages/react-scripts/package.json @@ -1,6 +1,6 @@ { "name": "@bentley/react-scripts", - "version": "3.4.12", + "version": "3.4.13", "description": "iModel.js configuration and scripts for Create React App.", "repository": { "type": "git", From 31d15c1394d92457018ab05a3eb11a7020b5a62f Mon Sep 17 00:00:00 2001 From: Caleb Shafer <31107829+calebmshafer@users.noreply.github.com> Date: Mon, 28 Jun 2021 09:27:08 -0400 Subject: [PATCH 3/5] switch the flag to be a disable rather than an enable --- packages/react-scripts/README-imodeljs.md | 2 +- packages/react-scripts/config/webpack.config.js | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/react-scripts/README-imodeljs.md b/packages/react-scripts/README-imodeljs.md index 399e8364ff2..bb6c906a783 100644 --- a/packages/react-scripts/README-imodeljs.md +++ b/packages/react-scripts/README-imodeljs.md @@ -24,7 +24,7 @@ Current upstream with `react-scripts@3.4.1`. | DISABLE_ESLINT | ✅ Used | ✅ Used | When set to `true`, webpack will not run eslint at all. This can speedup builds when you want to keep build and lint as separate steps. | | TRANSPILE_DEPS | ✅ Used | ✅ Used | When set to `false`, webpack will not run babel on anything in node_modules. Transpiling dependencies can be costly, and is often not necessary when targeting newer browsers. | | DISABLE_TERSER | 🚫 Ignored | ✅ Used | When set to `true`, skips all minification. Useful for PR builds and test apps. | - | USE_NEW_ASSET_COPY | ✅ Used | ✅ Used | When set to `true`, uses the new copy static assets workflow which copies all files from dependencies starting with `@bentley` or `@itwin` scope. In addition it would make them available to both a `build` and `start`. Note: There is a bug with the update when used in conjunction with pnpm or yarn workspaces. | + | DISABLE_NEW_ASSET_COPY | ✅ Used | ✅ Used | When set to `true`, disables the new copy static assets workflow which copies all files from dependencies starting with `@bentley` or `@itwin` scope. In addition it makes them available to both a `build` and `start` scripts. Note: There is a bug with the new asset copy when used with pnpm or yarn workspaces. | - Typing changes diff --git a/packages/react-scripts/config/webpack.config.js b/packages/react-scripts/config/webpack.config.js index efc2d8d1595..99e2fc44ca9 100644 --- a/packages/react-scripts/config/webpack.config.js +++ b/packages/react-scripts/config/webpack.config.js @@ -67,7 +67,7 @@ const shouldTranspileDeps = process.env.TRANSPILE_DEPS !== 'false'; const shouldMinify = process.env.DISABLE_TERSER !== 'true'; -const useNewAssetCopy = process.env.USE_NEW_ASSET_COPY === 'true'; +const disableNewAssetCopy = process.env.DISABLE_NEW_ASSET_COPY === 'true'; // End iModel.js Changes block @@ -701,7 +701,7 @@ module.exports = function(webpackEnv) { // NOTE: iModel.js specific plugin to copy a set of static resources from the node_modules // directory of each dependent package into the 'build/public' directory. // Used for resources such as locales, which are defined by each consuming package. - useNewAssetCopy + disableNewAssetCopy ? new CopyStaticAssetsPlugin({}) : new CopyBentleyStaticResourcesPlugin(['public'], true), From 407a140584b95e26f040f3ccefcf103a30e231db Mon Sep 17 00:00:00 2001 From: Caleb Shafer <31107829+calebmshafer@users.noreply.github.com> Date: Mon, 28 Jun 2021 09:32:45 -0400 Subject: [PATCH 4/5] fix ternary issue --- packages/react-scripts/config/webpack.config.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/react-scripts/config/webpack.config.js b/packages/react-scripts/config/webpack.config.js index 99e2fc44ca9..4bb98fed520 100644 --- a/packages/react-scripts/config/webpack.config.js +++ b/packages/react-scripts/config/webpack.config.js @@ -702,8 +702,8 @@ module.exports = function(webpackEnv) { // directory of each dependent package into the 'build/public' directory. // Used for resources such as locales, which are defined by each consuming package. disableNewAssetCopy - ? new CopyStaticAssetsPlugin({}) - : new CopyBentleyStaticResourcesPlugin(['public'], true), + ? new CopyBentleyStaticResourcesPlugin(['public'], true) + : new CopyStaticAssetsPlugin({}), // NOTE: FilterWarningsPlugin is used to ignore warning coming from sourcemaps new FilterWarningsPlugin({ exclude: /Failed to parse source map/ }), From 070a5ef65f6fde6395b0bd74b16b350019e0a601 Mon Sep 17 00:00:00 2001 From: Caleb Shafer <31107829+calebmshafer@users.noreply.github.com> Date: Mon, 28 Jun 2021 09:34:36 -0400 Subject: [PATCH 5/5] fix readme comments --- packages/react-scripts/README-imodeljs.md | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/react-scripts/README-imodeljs.md b/packages/react-scripts/README-imodeljs.md index bb6c906a783..61f32b192a9 100644 --- a/packages/react-scripts/README-imodeljs.md +++ b/packages/react-scripts/README-imodeljs.md @@ -16,15 +16,15 @@ Current upstream with `react-scripts@3.4.1`. > Note: These configuration variables are an extension of the [Advanced Configurations](create-react-app.dev/docs/advanced-configuration) supported by create-react-app. - | Variable | Development | Production | Usage | - | ----------------------- | ----------- | ---------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | - | USE_FAST_SASS | ✅ Used | ✅ Used | When set to `true`, use the fast-sass-loader instead of sass-loader. This helps with long build times on smaller machines attempting to build an app with a large amount of scss/sass files. | - | DEBUG_BUILD_PERFORMANCE | ✅ Used | 🚫 Ignored | When set to `true`, reports webpack build performance and bottlenecks. Uses the [speed measure webpack plugin](https://www.npmjs.com/package/speed-measure-webpack-plugin). | - | USE_FULL_SOURCEMAP | ✅ Used | 🚫 Ignored | When set to `true`, the sourcemaps generated use 'source-map' instead of 'cheap-module-source-map'. This is known to cause out-of-memory errors but gives full fidelity source maps in debug builds. | - | DISABLE_ESLINT | ✅ Used | ✅ Used | When set to `true`, webpack will not run eslint at all. This can speedup builds when you want to keep build and lint as separate steps. | - | TRANSPILE_DEPS | ✅ Used | ✅ Used | When set to `false`, webpack will not run babel on anything in node_modules. Transpiling dependencies can be costly, and is often not necessary when targeting newer browsers. | - | DISABLE_TERSER | 🚫 Ignored | ✅ Used | When set to `true`, skips all minification. Useful for PR builds and test apps. | - | DISABLE_NEW_ASSET_COPY | ✅ Used | ✅ Used | When set to `true`, disables the new copy static assets workflow which copies all files from dependencies starting with `@bentley` or `@itwin` scope. In addition it makes them available to both a `build` and `start` scripts. Note: There is a bug with the new asset copy when used with pnpm or yarn workspaces. | + | Variable | Development | Production | Usage | + | ----------------------- | ----------- | ---------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | + | USE_FAST_SASS | ✅ Used | ✅ Used | When set to `true`, use the fast-sass-loader instead of sass-loader. This helps with long build times on smaller machines attempting to build an app with a large amount of scss/sass files. | + | DEBUG_BUILD_PERFORMANCE | ✅ Used | 🚫 Ignored | When set to `true`, reports webpack build performance and bottlenecks. Uses the [speed measure webpack plugin](https://www.npmjs.com/package/speed-measure-webpack-plugin). | + | USE_FULL_SOURCEMAP | ✅ Used | 🚫 Ignored | When set to `true`, the sourcemaps generated use 'source-map' instead of 'cheap-module-source-map'. This is known to cause out-of-memory errors but gives full fidelity source maps in debug builds. | + | DISABLE_ESLINT | ✅ Used | ✅ Used | When set to `true`, webpack will not run eslint at all. This can speedup builds when you want to keep build and lint as separate steps. | + | TRANSPILE_DEPS | ✅ Used | ✅ Used | When set to `false`, webpack will not run babel on anything in node_modules. Transpiling dependencies can be costly, and is often not necessary when targeting newer browsers. | + | DISABLE_TERSER | 🚫 Ignored | ✅ Used | When set to `true`, skips all minification. Useful for PR builds and test apps. | + | DISABLE_NEW_ASSET_COPY | ✅ Used | ✅ Used | When set to `true`, disables the new copy static assets plugin which copies all files from dependencies starting with `@bentley` or `@itwin` scope. In addition it makes them available to both a `build` and `start` scripts. Note: There is a bug with the new asset copy when used with pnpm or yarn workspaces. | - Typing changes