update docusaurus from 2.0.0-alpha.70 to 2.0.0-beta.1 (#4889)

* exit with an error if no paths given to copy script

* consolidate and normalize scripts in website package

* update docusaurus from 2.0.0-alpha.70 to 2.0.0-beta.1

* fix badge url in fast-components doc

Author: radium-v

build/clean.js

@@ -1,3 +1,5 @@
+/* eslint-env node */
+/* eslint-disable @typescript-eslint/explicit-function-return-type,@typescript-eslint/no-var-requires,@typescript-eslint/typedef */
 /**
  * Utility for cleaning directories.
  * Usage: node build/clean.js %path%
@@ -15,7 +17,11 @@ const paths = argv._;
  * Function to remove a given path
  */
 function cleanPath(cleanPath) {
-    const removePath = path.resolve(process.cwd(), cleanPath)
+    if (!cleanPath) {
+        console.error("No path specified.");
+        process.exit(1);
+    }
+    const removePath = path.resolve(process.cwd(), cleanPath);
     rimraf(removePath, () => {
         console.log(removePath, "cleaned");
     });

package.json

@@ -20,13 +20,14 @@
       "sites/website"
     ],
     "nohoist": [
-      "**/react-syntax-highlighter",
       "**/@types/chai",
       "**/@types/jest",
       "**/@types/karma",
       "**/@types/mocha",
       "**/@types/node",
-      "**/chai"
+      "**/chai",
+      "**/html-minifier-terser",
+      "**/react-syntax-highlighter"
     ]
   },
   "repository": {

sites/fast-website/package.json

@@ -40,7 +40,7 @@
   "scripts": {
     "build:all": "yarn build:rollup && yarn build:webpack",
     "build:rollup": "rollup -c",
-    "build:webpack": "webpack --config=./webpack.prod.js",
+    "build:webpack": "webpack --config=./webpack.prod.js --progress",
     "clean": "rimraf dist temp",
     "prepare": "yarn clean && yarn build:rollup",
     "start": "webpack-dev-server --config=./webpack.dev.js --history-api-fallback --progress",

sites/website/docusaurus.config.js

@@ -1,3 +1,10 @@
+/* eslint-disable @typescript-eslint/typedef */
+/* eslint-disable @typescript-eslint/explicit-function-return-type */
+/* eslint-disable @typescript-eslint/no-var-requires */
+/* eslint-env node */
+const path = require("path");
+const fs = require("fs-extra");
+
 module.exports = {
     title: "FAST",
     tagline: "The adaptive interface system for modern web experiences",
@@ -135,4 +142,32 @@ module.exports = {
             },
         ],
     ],
+    plugins: [
+        // Work around an issue where Docusaurus resolves modules based on relative paths,
+        // which doesn't work properly when in the context of a monorepo.
+        // https://github.com/facebook/docusaurus/issues/3515
+        function webpackOverride(context, options) {
+            return {
+                configureWebpack(config) {
+                    return {
+                        resolve: {
+                            modules: [
+                                path.resolve(
+                                    path.dirname(
+                                        require.resolve("@docusaurus/core/package.json")
+                                    ),
+                                    "node_modules"
+                                ),
+                                "node_modules",
+                                path.resolve(
+                                    fs.realpathSync(process.cwd()),
+                                    "node_modules"
+                                ),
+                            ],
+                        },
+                    };
+                },
+            };
+        },
+    ],
 };

sites/website/package.json

@@ -3,12 +3,18 @@
   "version": "0.6.2",
   "private": true,
   "scripts": {
-    "clean": "node ../../build/clean.js docs",
-    "prepare-docs": "yarn clean && node src/prepare-docs.js",
-    "build-static": "node src/build-static.js",
-    "generate:badges": "yarn workspace @microsoft/site-utilities generate:badges",
-    "start": "yarn build-static && yarn prepare-docs && docusaurus start",
-    "build": "yarn generate:badges && yarn build-static && yarn prepare-docs && yarn docusaurus build"
+    "clean": "concurrently \"yarn:clean-*\"",
+    "clean-docs": "node ../../build/clean.js docs",
+    "clean-static": "node ../../build/clean.js static",
+    "copy-static": "node src/copy-static.js",
+    "generate": "concurrently \"yarn:generate-*\"",
+    "generate-badges": "yarn workspace @microsoft/site-utilities generate:badges",
+    "generate-docs": "node src/generate-docs.js",
+    "generate-homepage": "yarn workspace @microsoft/fast-website build",
+    "prebuild": "yarn clean && yarn generate && yarn copy-static",
+    "build": "docusaurus build",
+    "prestart": "yarn prebuild",
+    "start": "docusaurus start"
   },
   "browserslist": {
     "production": [
@@ -22,14 +28,11 @@
       "last 1 safari version"
     ]
   },
-  "dependencies": {
-    "@docusaurus/core": "2.0.0-alpha.70",
-    "@docusaurus/preset-classic": "2.0.0-alpha.70",
-    "@docusaurus/theme-live-codeblock": "2.0.0-alpha.70"
-  },
   "devDependencies": {
+    "@docusaurus/core": "2.0.0-beta.1",
+    "@docusaurus/preset-classic": "2.0.0-beta.1",
+    "@docusaurus/theme-live-codeblock": "2.0.0-beta.1",
     "@microsoft/api-documenter": "7.8.13",
-    "classnames": "^2.2.6",
-    "progress-bar-webpack-plugin": "^2.1.0"
+    "concurrently": "^6.2.0"
   }
 }

sites/website/src/build-static.js renamed to sites/website/src/copy-static.js

@@ -5,10 +5,6 @@
 /* eslint-disable @typescript-eslint/typedef */
 /* eslint-disable @typescript-eslint/no-var-requires */
 const path = require("path");
-const webpack = require("webpack");
-const merge = require("webpack-merge");
-const ProgressBarPlugin = require("progress-bar-webpack-plugin");
-const fastWebsiteConfig = require("@microsoft/fast-website/webpack.prod.js");
 const copy = require("../../../build/copy");
 
 function getPackageDir(pkg) {
@@ -17,41 +13,13 @@ function getPackageDir(pkg) {
 
 const outputPath = path.resolve(__dirname, "../static");
 
+const homepageDir = getPackageDir("@microsoft/fast-website");
 const utilitiesDir = getPackageDir("@microsoft/site-utilities");
 const fastComponentsDir = getPackageDir("@microsoft/fast-components");
 const utilitiesAssets = path.resolve(utilitiesDir, "statics/assets");
 
-const config = merge(fastWebsiteConfig, {
-    output: { path: outputPath },
-    performance: { hints: false },
-    plugins: [new ProgressBarPlugin()],
-});
-
-const compiler = webpack(config);
-
-compiler.hooks.beforeRun.tap("buildMessage", () => {
-    console.info("Building @microsoft/fast-website with webpack to static/");
-});
-
-compiler.run(async (err, stats) => {
-    if (err) {
-        console.error(err.stack || err);
-        if (err.details) {
-            console.error(err.details);
-        }
-        process.exit(1);
-    }
-
-    const info = stats.toJson();
-
-    if (stats.hasErrors()) {
-        info.errors.forEach(e => console.error(e));
-        process.exit(1);
-    }
-
-    if (stats.hasWarnings()) {
-        info.warnings.forEach(w => console.warn(w));
-    }
+(async function () {
+    await copy([`${homepageDir}/dist/*`], outputPath);
 
     await copy(
         [
@@ -63,5 +31,10 @@ compiler.run(async (err, stats) => {
         outputPath
     );
 
+    await copy([`${homepageDir}/dist/bundle/*`], `${outputPath}/bundle`, {
+        flat: false,
+        verbose: true,
+        up: true,
+    });
     await copy([`${utilitiesAssets}/badges/*.svg`], `${outputPath}/badges`);
-});
+})();

sites/website/src/docs/components/getting-started.md

@@ -4,7 +4,7 @@ sidebar_label: Getting Started
 custom_edit_url: https://github.com/microsoft/fast/edit/master/sites/website/src/docs/fast-foundation/getting-started.md
 ---
 [![License: MIT](/badges/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
-[![npm version](/badges/fast-components.svg)](https://www.npmjs.com/package/@microsoft/fast-element)
+[![npm version](/badges/fast-components.svg)](https://www.npmjs.com/package/@microsoft/fast-components)
 
 The `fast-components` and `@fluentui/web-components` libraries contain Web Components built on top of our standard component and design system foundation. `fast-components` express the FAST design language while `@fluentui/web-components` expresses Microsoft's Fluent design language.