[heft-web-rig] Add an "app" profile, upgrade to Webpack 5, implement new CSS rules

build-tests-samples/heft-storybook-react-tutorial-storykit/package.json

@@ -11,26 +11,27 @@
     "_phase:build": ""
   },
   "devDependencies": {
-    "@babel/core": "^7.14.8",
-    "@storybook/addon-actions": "~6.3.6",
-    "@storybook/addon-essentials": "~6.3.6",
-    "@storybook/addon-links": "~6.3.6",
-    "@storybook/cli": "~6.3.6",
-    "@storybook/components": "~6.3.0",
-    "@storybook/core-events": "~6.3.0",
-    "@storybook/react": "~6.3.6",
-    "@storybook/theming": "~6.3.0",
+    "@babel/core": "~7.17.0",
+    "@storybook/addon-actions": "~6.4.18",
+    "@storybook/addon-essentials": "~6.4.18",
+    "@storybook/addon-links": "~6.4.18",
+    "@storybook/cli": "~6.4.18",
+    "@storybook/components": "~6.4.18",
+    "@storybook/core-events": "~6.4.18",
+    "@storybook/react": "~6.4.18",
+    "@storybook/theming": "~6.4.18",
     "@types/heft-jest": "1.0.1",
-    "@types/react-dom": "16.9.8",
-    "@types/react": "16.9.45",
+    "@types/react-dom": "16.9.14",
+    "@types/react": "16.14.23",
     "@types/webpack-env": "1.13.0",
-    "babel-loader": "^8.2.2",
-    "css-loader": "~4.2.1",
+    "babel-loader": "~8.2.3",
+    "css-loader": "~5.2.7",
     "jest": "~27.4.2",
     "react-dom": "~16.13.1",
     "react": "~16.13.1",
-    "style-loader": "~1.2.1",
+    "style-loader": "~2.0.0",
     "typescript": "~4.5.2",
-    "webpack": "~4.44.2"
+    "webpack": "~4.44.2",
+    "terser-webpack-plugin": "~3.0.8"
   }
 }

build-tests-samples/heft-storybook-react-tutorial/config/heft.json

@@ -40,7 +40,7 @@
       /**
        * The path to the plugin package.
        */
-      "plugin": "@rushstack/heft-webpack5-plugin"
+      "plugin": "@rushstack/heft-webpack4-plugin"
 
       /**
        * An optional object that provides additional settings that may be defined by the plugin.

build-tests-samples/heft-storybook-react-tutorial/package.json

@@ -6,27 +6,28 @@
   "scripts": {
     "build": "heft build --clean",
     "start": "heft start",
+    "storybook": "heft start --storybook",
     "_phase:build": "heft build --clean",
     "_phase:test": "heft test --no-build"
   },
   "devDependencies": {
     "@rushstack/eslint-config": "workspace:*",
     "@rushstack/heft-jest-plugin": "workspace:*",
     "@rushstack/heft-storybook-plugin": "workspace:*",
-    "@rushstack/heft-webpack5-plugin": "workspace:*",
+    "@rushstack/heft-webpack4-plugin": "workspace:*",
     "@rushstack/heft": "workspace:*",
     "@types/heft-jest": "1.0.1",
-    "@types/react-dom": "16.9.8",
-    "@types/react": "16.9.45",
+    "@types/react-dom": "16.9.14",
+    "@types/react": "16.14.23",
     "@types/webpack-env": "1.13.0",
-    "css-loader": "~4.2.1",
+    "css-loader": "~5.2.7",
     "eslint": "~8.7.0",
     "heft-storybook-react-tutorial-storykit": "workspace:*",
-    "html-webpack-plugin": "~5.5.0",
+    "html-webpack-plugin": "~4.5.2",
     "react-dom": "~16.13.1",
     "react": "~16.13.1",
-    "source-map-loader": "~1.1.2",
-    "style-loader": "~1.2.1",
+    "source-map-loader": "~1.1.3",
+    "style-loader": "~2.0.0",
     "typescript": "~4.5.2",
     "webpack": "~4.44.2"
   }

build-tests-samples/heft-webpack-basic-tutorial/package.json

@@ -15,17 +15,17 @@
     "@rushstack/heft-jest-plugin": "workspace:*",
     "@rushstack/heft-webpack5-plugin": "workspace:*",
     "@types/heft-jest": "1.0.1",
-    "@types/react": "16.9.45",
-    "@types/react-dom": "16.9.8",
+    "@types/react": "16.14.23",
+    "@types/react-dom": "16.9.14",
     "@types/webpack-env": "1.13.0",
-    "css-loader": "~4.2.1",
+    "css-loader": "~6.6.0",
     "eslint": "~8.7.0",
     "html-webpack-plugin": "~5.5.0",
     "react": "~16.13.1",
     "react-dom": "~16.13.1",
-    "style-loader": "~1.2.1",
+    "style-loader": "~3.3.1",
     "typescript": "~4.5.2",
-    "webpack": "~4.44.2",
-    "source-map-loader": "~1.1.2"
+    "webpack": "~5.68.0",
+    "source-map-loader": "~3.0.1"
   }
 }

build-tests/heft-sass-test/config/heft.json

@@ -40,7 +40,7 @@
       /**
        * The path to the plugin package.
        */
-      "plugin": "@rushstack/heft-webpack5-plugin"
+      "plugin": "@rushstack/heft-webpack4-plugin"
 
       /**
        * An optional object that provides additional settings that may be defined by the plugin.

build-tests/heft-sass-test/package.json

@@ -14,22 +14,22 @@
     "@rushstack/heft": "workspace:*",
     "@rushstack/heft-jest-plugin": "workspace:*",
     "@rushstack/heft-sass-plugin": "workspace:*",
-    "@rushstack/heft-webpack5-plugin": "workspace:*",
+    "@rushstack/heft-webpack4-plugin": "workspace:*",
     "@types/heft-jest": "1.0.1",
-    "@types/react-dom": "16.9.8",
-    "@types/react": "16.9.45",
+    "@types/react-dom": "16.9.14",
+    "@types/react": "16.14.23",
     "@types/webpack-env": "1.13.0",
-    "autoprefixer": "~9.8.0",
-    "css-loader": "~4.2.1",
+    "autoprefixer": "~10.4.2",
+    "css-loader": "~5.2.7",
     "eslint": "~8.7.0",
-    "html-webpack-plugin": "~5.5.0",
-    "node-sass": "6.0.1",
-    "postcss": "7.0.32",
-    "postcss-loader": "~4.0.1",
+    "html-webpack-plugin": "~4.5.2",
+    "postcss": "~8.4.6",
+    "postcss-loader": "~4.1.0",
     "react-dom": "~16.13.1",
     "react": "~16.13.1",
-    "sass-loader": "~12.3.0",
-    "style-loader": "~1.2.1",
+    "sass": "~1.3.0",
+    "sass-loader": "~10.0.0",
+    "style-loader": "~2.0.0",
     "typescript": "~4.5.2",
     "webpack": "~4.44.2"
   },

build-tests/heft-sass-test/webpack.config.js

@@ -3,7 +3,6 @@
 const path = require('path');
 const Autoprefixer = require('autoprefixer');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
-const sass = require('node-sass');
 
 /**
  * If the "--production" command-line parameter is specified when invoking Heft, then the

build-tests/localization-plugin-test-01/package.json

@@ -14,11 +14,11 @@
     "@rushstack/node-core-library": "workspace:*",
     "@rushstack/set-webpack-public-path-plugin": "workspace:*",
     "@types/webpack-env": "1.13.0",
-    "html-webpack-plugin": "~4.5.0",
+    "html-webpack-plugin": "~4.5.2",
     "ts-loader": "6.0.0",
     "typescript": "~4.5.2",
     "webpack": "~4.44.2",
-    "webpack-bundle-analyzer": "~3.6.0",
+    "webpack-bundle-analyzer": "~4.5.0",
     "webpack-cli": "~3.3.2",
     "webpack-dev-server": "~3.11.0"
   }

build-tests/localization-plugin-test-02/package.json

@@ -15,12 +15,12 @@
     "@rushstack/set-webpack-public-path-plugin": "workspace:*",
     "@types/lodash": "4.14.116",
     "@types/webpack-env": "1.13.0",
-    "html-webpack-plugin": "~4.5.0",
+    "html-webpack-plugin": "~4.5.2",
     "lodash": "~4.17.15",
     "ts-loader": "6.0.0",
     "typescript": "~4.5.2",
     "webpack": "~4.44.2",
-    "webpack-bundle-analyzer": "~3.6.0",
+    "webpack-bundle-analyzer": "~4.5.0",
     "webpack-cli": "~3.3.2",
     "webpack-dev-server": "~3.11.0"
   }

build-tests/localization-plugin-test-03/package.json

@@ -13,11 +13,11 @@
     "@rushstack/node-core-library": "workspace:*",
     "@rushstack/set-webpack-public-path-plugin": "workspace:*",
     "@types/webpack-env": "1.13.0",
-    "html-webpack-plugin": "~4.5.0",
+    "html-webpack-plugin": "~4.5.2",
     "ts-loader": "6.0.0",
     "typescript": "~4.5.2",
     "webpack": "~4.44.2",
-    "webpack-bundle-analyzer": "~3.6.0",
+    "webpack-bundle-analyzer": "~4.5.0",
     "webpack-cli": "~3.3.2",
     "webpack-dev-server": "~3.11.0"
   }

build-tests/set-webpack-public-path-plugin-webpack4-test/package.json

@@ -14,9 +14,10 @@
     "@rushstack/heft": "workspace:*",
     "@rushstack/heft-webpack4-plugin": "workspace:*",
     "@rushstack/set-webpack-public-path-plugin": "workspace:*",
-    "html-webpack-plugin": "~4.5.0",
+    "html-webpack-plugin": "~4.5.2",
     "@types/webpack-env": "1.13.0",
     "eslint": "~8.7.0",
-    "typescript": "~4.5.2"
+    "typescript": "~4.5.2",
+    "webpack": "~4.44.2"
   }
 }

common/changes/@microsoft/load-themed-styles/octogonz-heft-web-rig-revamp_2022-02-05-10-39.json

@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "@microsoft/load-themed-styles",
+      "comment": "Enable importHelpers=true",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@microsoft/load-themed-styles"
+}

common/changes/@microsoft/rush/octogonz-heft-web-rig-revamp_2022-02-05-10-39.json

@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "@microsoft/rush",
+      "comment": "",
+      "type": "none"
+    }
+  ],
+  "packageName": "@microsoft/rush"
+}

common/changes/@rushstack/heft-dev-cert-plugin/octogonz-heft-web-rig-revamp_2022-02-05-10-39.json

@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "@rushstack/heft-dev-cert-plugin",
+      "comment": "",
+      "type": "none"
+    }
+  ],
+  "packageName": "@rushstack/heft-dev-cert-plugin"
+}

common/changes/@rushstack/heft-node-rig/octogonz-heft-web-rig-revamp_2022-02-05-01-55.json

@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "@rushstack/heft-node-rig",
+      "comment": "Set useUnknownInCatchVariables=false in tsconfig.json, to work around https://github.com/microsoft/TypeScript/issues/42596",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@rushstack/heft-node-rig"
+}

common/changes/@rushstack/heft-sass-plugin/octogonz-heft-web-rig-revamp_2022-02-05-10-39.json

@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "@rushstack/heft-sass-plugin",
+      "comment": "Upgrade postcss",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@rushstack/heft-sass-plugin"
+}