@docusaurus/core 2.0.0-beta.12faed89d → 2.0.0-beta.14

package/bin/beforeCli.js

@@ -5,7 +5,9 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-const chalk = require('chalk');
+// @ts-check
+
+const logger = require('@docusaurus/logger').default;
 const fs = require('fs-extra');
 const semver = require('semver');
 const path = require('path');
@@ -42,22 +44,48 @@ const notifier = updateNotifier({
 // Hacky way to ensure we check for updates on first run
 // Note: the notification will only happen in the 2nd run
 // See https://github.com/yeoman/update-notifier/issues/209
-if (
-  !notifier.disabled &&
-  Date.now() - notifier.config.get('lastUpdateCheck') < 50
-) {
-  notifier.config.set('lastUpdateCheck', 0);
-  notifier.check();
+try {
+  if (
+    notifier.config &&
+    !notifier.disabled &&
+    Date.now() - notifier.config.get('lastUpdateCheck') < 50
+  ) {
+    notifier.config.set('lastUpdateCheck', 0);
+    notifier.check();
+  }
+} catch (e) {
+  // Do not stop cli if this fails, see https://github.com/facebook/docusaurus/issues/5400
+  logger.error(e);
+}
+
+// We don't want to display update message for canary releases
+// See https://github.com/facebook/docusaurus/issues/5378
+function ignoreUpdate(update) {
+  const isCanaryRelease =
+    update && update.current && update.current.startsWith('0.0.0');
+  return isCanaryRelease;
 }
 
-if (notifier.update && notifier.update.current !== notifier.update.latest) {
+if (
+  notifier.config &&
+  notifier.update &&
+  semver.lt(notifier.update.current, notifier.update.latest)
+) {
   // Because notifier clears cached data after reading it, leading to notifier not consistently displaying the update
   // See https://github.com/yeoman/update-notifier/issues/209
   notifier.config.set('update', notifier.update);
 
+  if (ignoreUpdate(notifier.update)) {
+    // @ts-expect-error: it works
+    return;
+  }
+
   // eslint-disable-next-line import/no-dynamic-require, global-require
   const sitePkg = require(path.resolve(process.cwd(), 'package.json'));
-  const siteDocusaurusPackagesForUpdate = Object.keys(sitePkg.dependencies)
+  const siteDocusaurusPackagesForUpdate = Object.keys({
+    ...sitePkg.dependencies,
+    ...sitePkg.devDependencies,
+  })
     .filter((p) => p.startsWith('@docusaurus'))
     .map((p) => p.concat('@latest'))
     .join(' ');
@@ -66,6 +94,7 @@ if (notifier.update && notifier.update.current !== notifier.update.latest) {
     ? `yarn upgrade ${siteDocusaurusPackagesForUpdate}`
     : `npm i ${siteDocusaurusPackagesForUpdate}`;
 
+  /** @type {import('boxen').Options} */
   const boxenOptions = {
     padding: 1,
     margin: 1,
@@ -75,13 +104,12 @@ if (notifier.update && notifier.update.current !== notifier.update.latest) {
   };
 
   const docusaurusUpdateMessage = boxen(
-    `Update available ${chalk.dim(`${notifier.update.current}`)}${chalk.reset(
-      ' → ',
-    )}${chalk.green(
-      `${notifier.update.latest}`,
-    )}\n\nTo upgrade Docusaurus packages with the latest version, run the following command:\n${chalk.cyan(
-      `${upgradeCommand}`,
-    )}`,
+    `Update available ${logger.dim(
+      `${notifier.update.current}`,
+    )} → ${logger.green(`${notifier.update.latest}`)}
+
+To upgrade Docusaurus packages with the latest version, run the following command:
+${logger.code(upgradeCommand)}`,
     boxenOptions,
   );
 
@@ -90,11 +118,7 @@ if (notifier.update && notifier.update.current !== notifier.update.latest) {
 
 // notify user if node version needs to be updated
 if (!semver.satisfies(process.version, requiredVersion)) {
-  console.log(
-    chalk.red(`\nMinimum Node version not met :(`) +
-      chalk.yellow(
-        `\n\nYou are using Node ${process.version}. We require Node ${requiredVersion} or up!\n`,
-      ),
-  );
+  logger.error('Minimum Node.js version not met :(');
+  logger.info`You are using Node.js number=${process.version}, Requirement: Node.js number=${requiredVersion}.`;
   process.exit(1);
 }

package/bin/docusaurus.js

@@ -1,7 +1,4 @@
 #!/usr/bin/env node
-
-// TODO remove when fixed: https://github.com/Stuk/eslint-plugin-header/issues/39
-/* eslint-disable header/header */
 /**
  * Copyright (c) Facebook, Inc. and its affiliates.
  *
@@ -9,8 +6,10 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-const chalk = require('chalk');
-const path = require('path');
+// @ts-check
+
+const logger = require('@docusaurus/logger').default;
+const fs = require('fs');
 const cli = require('commander');
 const {
   build,
@@ -26,6 +25,8 @@ const {
 
 require('./beforeCli');
 
+const resolveDir = (dir = '.') => fs.realpathSync(dir);
+
 cli.version(require('../package.json').version).usage('<command> [options]');
 
 cli
@@ -51,8 +52,8 @@ cli
     '--no-minify',
     'build website without minimizing JS bundles (default: false)',
   )
-  .action((siteDir = '.', {bundleAnalyzer, config, outDir, locale, minify}) => {
-    build(path.resolve(siteDir), {
+  .action((siteDir, {bundleAnalyzer, config, outDir, locale, minify}) => {
+    build(resolveDir(siteDir), {
       bundleAnalyzer,
       outDir,
       config,
@@ -69,14 +70,8 @@ cli
     'copy TypeScript theme files when possible (default: false)',
   )
   .option('--danger', 'enable swizzle for internal component of themes')
-  .action((themeName, componentName, siteDir = '.', {typescript, danger}) => {
-    swizzle(
-      path.resolve(siteDir),
-      themeName,
-      componentName,
-      typescript,
-      danger,
-    );
+  .action((themeName, componentName, siteDir, {typescript, danger}) => {
+    swizzle(resolveDir(siteDir), themeName, componentName, typescript, danger);
   });
 
 cli
@@ -98,8 +93,8 @@ cli
     '--skip-build',
     'skip building website before deploy it (default: false)',
   )
-  .action((siteDir = '.', {outDir, skipBuild, config}) => {
-    deploy(path.resolve(siteDir), {
+  .action((siteDir, {outDir, skipBuild, config}) => {
+    deploy(resolveDir(siteDir), {
       outDir,
       config,
       skipBuild,
@@ -125,19 +120,17 @@ cli
     '--poll [interval]',
     'use polling rather than watching for reload (default: false). Can specify a poll interval in milliseconds',
   )
-  .action(
-    (siteDir = '.', {port, host, locale, config, hotOnly, open, poll}) => {
-      start(path.resolve(siteDir), {
-        port,
-        host,
-        locale,
-        config,
-        hotOnly,
-        open,
-        poll,
-      });
-    },
-  );
+  .action((siteDir, {port, host, locale, config, hotOnly, open, poll}) => {
+    start(resolveDir(siteDir), {
+      port,
+      host,
+      locale,
+      config,
+      hotOnly,
+      open,
+      poll,
+    });
+  });
 
 cli
   .command('serve [siteDir]')
@@ -155,7 +148,7 @@ cli
   .option('-h, --host <host>', 'use specified host (default: localhost)')
   .action(
     (
-      siteDir = '.',
+      siteDir,
       {
         dir = 'build',
         port = 3000,
@@ -164,7 +157,7 @@ cli
         config,
       },
     ) => {
-      serve(path.resolve(siteDir), {
+      serve(resolveDir(siteDir), {
         dir,
         port,
         build: buildSite,
@@ -177,8 +170,8 @@ cli
 cli
   .command('clear [siteDir]')
   .description('Remove build artifacts.')
-  .action((siteDir = '.') => {
-    clear(path.resolve(siteDir));
+  .action((siteDir) => {
+    clear(resolveDir(siteDir));
   });
 
 cli
@@ -202,10 +195,10 @@ cli
   )
   .action(
     (
-      siteDir = '.',
+      siteDir,
       {locale = undefined, override = false, messagePrefix = '', config},
     ) => {
-      writeTranslations(path.resolve(siteDir), {
+      writeTranslations(resolveDir(siteDir), {
         locale,
         override,
         config,
@@ -215,16 +208,20 @@ cli
   );
 
 cli
-  .command('write-heading-ids [contentDir]')
+  .command('write-heading-ids [contentDir] [files]')
   .description('Generate heading ids in Markdown content.')
-  .action((siteDir = '.') => {
-    writeHeadingIds(siteDir);
-  });
+  .option(
+    '--maintain-case',
+    "keep the headings' casing, otherwise make all lowercase (default: false)",
+  )
+  .option('--overwrite', 'overwrite existing heading IDs (default: false)')
+  .action((siteDir, files, options) =>
+    writeHeadingIds(resolveDir(siteDir), files, options),
+  );
 
 cli.arguments('<command>').action((cmd) => {
   cli.outputHelp();
-  console.log(`  ${chalk.red(`\n  Unknown command ${chalk.yellow(cmd)}.`)}.`);
-  console.log();
+  logger.error`    Unknown command name=${cmd}.`;
 });
 
 function isInternalCommand(command) {
@@ -242,7 +239,8 @@ function isInternalCommand(command) {
 
 async function run() {
   if (!isInternalCommand(process.argv.slice(2)[0])) {
-    await externalCommand(cli, path.resolve('.'));
+    // @ts-expect-error: Hmmm
+    await externalCommand(cli, resolveDir('.'));
   }
 
   cli.parse(process.argv);
@@ -255,6 +253,6 @@ async function run() {
 run();
 
 process.on('unhandledRejection', (err) => {
-  console.error(chalk.red(err.stack));
+  logger.error(err.stack);
   process.exit(1);
 });

package/lib/babel/preset.d.ts

@@ -1,3 +1,9 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
 import { ConfigAPI, TransformOptions } from '@babel/core';
 declare function babelPresets(api: ConfigAPI): TransformOptions;
 export default babelPresets;

package/lib/babel/preset.js

@@ -1,13 +1,13 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
 /**
  * Copyright (c) Facebook, Inc. and its affiliates.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-const path_1 = tslib_1.__importDefault(require("path"));
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const path_1 = (0, tslib_1.__importDefault)(require("path"));
 function getTransformOptions(isServer) {
     const absoluteRuntimePath = path_1.default.dirname(require.resolve(`@babel/runtime/package.json`));
     return {

package/lib/choosePort.js

@@ -12,10 +12,10 @@ const tslib_1 = require("tslib");
  * uses many of the same utility functions to implement it.
  */
 const child_process_1 = require("child_process");
-const detect_port_1 = tslib_1.__importDefault(require("detect-port"));
-const is_root_1 = tslib_1.__importDefault(require("is-root"));
-const chalk_1 = tslib_1.__importDefault(require("chalk"));
-const prompts_1 = tslib_1.__importDefault(require("prompts"));
+const detect_port_1 = (0, tslib_1.__importDefault)(require("detect-port"));
+const is_root_1 = (0, tslib_1.__importDefault)(require("is-root"));
+const logger_1 = (0, tslib_1.__importDefault)(require("@docusaurus/logger"));
+const prompts_1 = (0, tslib_1.__importDefault)(require("prompts"));
 const isInteractive = process.stdout.isTTY;
 const execOptions = {
     encoding: 'utf8',
@@ -31,19 +31,19 @@ function clearConsole() {
 }
 // Gets process id of what is on port
 function getProcessIdOnPort(port) {
-    return child_process_1.execSync(`lsof -i:${port} -P -t -sTCP:LISTEN`, execOptions)
+    return (0, child_process_1.execSync)(`lsof -i:${port} -P -t -sTCP:LISTEN`, execOptions)
         .toString()
         .split('\n')[0]
         .trim();
 }
 // Gets process command
 function getProcessCommand(processId) {
-    const command = child_process_1.execSync(`ps -o command -p ${processId} | sed -n 2p`, execOptions);
+    const command = (0, child_process_1.execSync)(`ps -o command -p ${processId} | sed -n 2p`, execOptions);
     return command.toString().replace(/\n$/, '');
 }
 // Gets directory of a process from its process id
 function getDirectoryOfProcessById(processId) {
-    return child_process_1.execSync(`lsof -p ${processId} | awk '$4=="cwd" {for (i=9; i<=NF; i++) printf "%s ", $i}'`, execOptions)
+    return (0, child_process_1.execSync)(`lsof -p ${processId} | awk '$4=="cwd" {for (i=9; i<=NF; i++) printf "%s ", $i}'`, execOptions)
         .toString()
         .trim();
 }
@@ -53,10 +53,7 @@ function getProcessForPort(port) {
         const processId = getProcessIdOnPort(port);
         const directory = getDirectoryOfProcessById(processId);
         const command = getProcessCommand(processId);
-        return (chalk_1.default.cyan(command) +
-            chalk_1.default.grey(` (pid ${processId})\n`) +
-            chalk_1.default.blue('  in ') +
-            chalk_1.default.cyan(directory));
+        return logger_1.default.interpolate `code=${command} subdue=${`(pid ${processId})`} in path=${directory}`;
     }
     catch (e) {
         return null;
@@ -67,12 +64,12 @@ function getProcessForPort(port) {
  * to choose another if port is already being used
  */
 async function choosePort(host, defaultPort) {
-    // @ts-expect-error: bad lib typedef?
-    return detect_port_1.default(defaultPort, host).then((port) => new Promise((resolve) => {
+    return (0, detect_port_1.default)({ port: defaultPort, hostname: host }).then((port) => new Promise((resolve) => {
         if (port === defaultPort) {
-            return resolve(port);
+            resolve(port);
+            return;
         }
-        const message = process.platform !== 'win32' && defaultPort < 1024 && !is_root_1.default()
+        const message = process.platform !== 'win32' && defaultPort < 1024 && !(0, is_root_1.default)()
             ? `Admin permissions are required to run a server on a port below 1024.`
             : `Something is already running on port ${defaultPort}.`;
         if (isInteractive) {
@@ -81,10 +78,12 @@ async function choosePort(host, defaultPort) {
             const question = {
                 type: 'confirm',
                 name: 'shouldChangePort',
-                message: `${chalk_1.default.yellow(`${message}${existingProcess ? ` Probably:\n  ${existingProcess}` : ''}`)}\n\nWould you like to run the app on another port instead?`,
+                message: logger_1.default.yellow(`${logger_1.default.bold('[WARNING]')} ${message}${existingProcess ? ` Probably:\n  ${existingProcess}` : ''}
+
+Would you like to run the app on another port instead?`),
                 initial: true,
             };
-            prompts_1.default(question).then((answer) => {
+            (0, prompts_1.default)(question).then((answer) => {
                 if (answer.shouldChangePort === true) {
                     resolve(port);
                 }
@@ -94,12 +93,12 @@ async function choosePort(host, defaultPort) {
             });
         }
         else {
-            console.log(chalk_1.default.red(message));
+            logger_1.default.error(message);
             resolve(null);
         }
-        return null;
     }), (err) => {
-        throw new Error(`${chalk_1.default.red(`Could not find an open port at ${chalk_1.default.bold(host)}.`)}\n${`Network error message: "${err.message}".` || err}\n`);
+        throw new Error(`Could not find an open port at ${host}.
+${`Network error message: "${err.message || err}".`}`);
     });
 }
 exports.default = choosePort;

package/lib/client/.eslintrc.js

@@ -21,7 +21,6 @@ module.exports = {
           '**/../server/**',
           '**/../commands/**',
           '**/../webpack/**',
-          '**/../constants',
         ],
       },
     ],

package/lib/client/App.js

@@ -4,34 +4,24 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import React, { useEffect, useState } from 'react';
+import React from 'react';
 import routes from '@generated/routes';
-import siteConfig from '@generated/docusaurus.config';
-import globalData from '@generated/globalData';
-import i18n from '@generated/i18n';
-import codeTranslations from '@generated/codeTranslations';
-import siteMetadata from '@generated/site-metadata';
 import renderRoutes from './exports/renderRoutes';
-import DocusaurusContext from './exports/context';
+import { BrowserContextProvider } from './exports/browserContext';
+import { DocusaurusContextProvider } from './exports/docusaurusContext';
 import PendingNavigation from './PendingNavigation';
 import BaseUrlIssueBanner from './baseUrlIssueBanner/BaseUrlIssueBanner';
 import Root from '@theme/Root';
 import './client-lifecycles-dispatcher';
+// TODO, quick fix for CSS insertion order
+import ErrorBoundary from '@docusaurus/ErrorBoundary';
+import Error from '@theme/Error';
 function App() {
-    const [isClient, setIsClient] = useState(false);
-    useEffect(() => {
-        setIsClient(true);
-    }, []);
-    return (React.createElement(DocusaurusContext.Provider, { value: {
-            siteConfig,
-            siteMetadata,
-            globalData,
-            i18n,
-            codeTranslations,
-            isClient,
-        } },
-        React.createElement(Root, null,
-            React.createElement(BaseUrlIssueBanner, null),
-            React.createElement(PendingNavigation, { routes: routes }, renderRoutes(routes)))));
+    return (React.createElement(ErrorBoundary, { fallback: Error },
+        React.createElement(DocusaurusContextProvider, null,
+            React.createElement(BrowserContextProvider, null,
+                React.createElement(Root, null,
+                    React.createElement(BaseUrlIssueBanner, null),
+                    React.createElement(PendingNavigation, { routes: routes, delay: 1000 }, renderRoutes(routes)))))));
 }
 export default App;

package/lib/client/LinksCollector.d.ts

@@ -13,8 +13,8 @@ declare type StatefulLinksCollector = LinksCollector & {
 };
 export declare const createStatefulLinksCollector: () => StatefulLinksCollector;
 export declare const useLinksCollector: () => LinksCollector;
-export declare const ProvideLinksCollector: ({ children, linksCollector, }: {
+export declare function ProvideLinksCollector({ children, linksCollector, }: {
     children: ReactNode;
     linksCollector: LinksCollector;
-}) => JSX.Element;
+}): JSX.Element;
 export {};

package/lib/client/LinksCollector.js

@@ -12,9 +12,7 @@ export const createStatefulLinksCollector = () => {
         collectLink: (link) => {
             allLinks.add(link);
         },
-        getCollectedLinks: () => {
-            return [...allLinks];
-        },
+        getCollectedLinks: () => [...allLinks],
     };
 };
 const Context = createContext({
@@ -23,9 +21,7 @@ const Context = createContext({
         // we only use the broken links checker server-side
     },
 });
-export const useLinksCollector = () => {
-    return useContext(Context);
-};
-export const ProvideLinksCollector = ({ children, linksCollector, }) => {
+export const useLinksCollector = () => useContext(Context);
+export function ProvideLinksCollector({ children, linksCollector, }) {
     return React.createElement(Context.Provider, { value: linksCollector }, children);
-};
+}

package/lib/client/PendingNavigation.d.ts

@@ -4,6 +4,29 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
+/// <reference types="node" />
+import React from 'react';
+import { RouteComponentProps } from 'react-router-dom';
+import { RouteConfig } from 'react-router-config';
+import type { Location } from '@docusaurus/history';
 import './nprogress.css';
-declare const _default: any;
+interface Props extends RouteComponentProps {
+    readonly routes: RouteConfig[];
+    readonly delay: number;
+    readonly location: Location;
+}
+interface State {
+    nextRouteHasLoaded: boolean;
+}
+declare class PendingNavigation extends React.Component<Props, State> {
+    previousLocation: Location | null;
+    progressBarTimeout: NodeJS.Timeout | null;
+    constructor(props: Props);
+    shouldComponentUpdate(nextProps: Props, nextState: State): boolean;
+    clearProgressBarTimeout(): void;
+    startProgressBar(delay: number): void;
+    stopProgressBar(): void;
+    render(): JSX.Element;
+}
+declare const _default: React.ComponentClass<Pick<Props, "routes" | "delay">, any> & import("react-router").WithRouterStatics<typeof PendingNavigation>;
 export default _default;

package/lib/client/PendingNavigation.js

@@ -26,7 +26,7 @@ class PendingNavigation extends React.Component {
     // is done loading.
     shouldComponentUpdate(nextProps, nextState) {
         const routeDidChange = nextProps.location !== this.props.location;
-        const { routes, delay = 1000 } = this.props;
+        const { routes, delay } = this.props;
         // If `routeDidChange` is true, means the router is trying to navigate to a new
         // route. We will preload the new route.
         if (routeDidChange) {

package/lib/client/baseUrlIssueBanner/BaseUrlIssueBanner.d.ts

@@ -6,4 +6,9 @@
  */
 /// <reference types="react" />
 import './styles.module.css';
+declare global {
+    interface Window {
+        __DOCUSAURUS_INSERT_BASEURL_BANNER: boolean;
+    }
+}
 export default function BaseUrlIssueBanner(): JSX.Element | null;

package/lib/client/client-lifecycles-dispatcher.d.ts

@@ -5,8 +5,8 @@
  * LICENSE file in the root directory of this source tree.
  */
 interface Dispatchers {
-    onRouteUpdate: (...args: any) => void;
-    onRouteUpdateDelayed: (...args: any) => void;
+    onRouteUpdate: (...args: unknown[]) => void;
+    onRouteUpdateDelayed: (...args: unknown[]) => void;
 }
 declare const clientLifecyclesDispatchers: Dispatchers;
 export default clientLifecyclesDispatchers;

package/lib/client/client-lifecycles-dispatcher.js

@@ -4,8 +4,6 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-// too dynamic
-/* eslint-disable @typescript-eslint/no-explicit-any */
 import clientModules from '@generated/client-modules';
 function dispatchLifecycleAction(lifecycleAction, ...args) {
     clientModules.forEach((clientModule) => {

package/lib/client/docusaurus.d.ts

@@ -1,3 +1,9 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
 declare global {
     const __webpack_require__: {
         gca: (name: string) => string;

package/lib/client/docusaurus.js

@@ -12,31 +12,23 @@ import preloadHelper from './preload';
 import flat from './flat';
 const fetched = {};
 const loaded = {};
+// If user is on slow or constrained connection.
 const isSlowConnection = () => {
-    // If user is on slow or constrained connection.
-    if (`connection` in navigator) {
-        if ((navigator.connection.effectiveType || ``).indexOf(`2g`) !== -1 &&
-            navigator.connection.saveData) {
-            return true;
-        }
-    }
-    return false;
+    var _a, _b;
+    return ((_a = navigator.connection) === null || _a === void 0 ? void 0 : _a.effectiveType.includes('2g')) &&
+        ((_b = navigator.connection) === null || _b === void 0 ? void 0 : _b.saveData);
 };
 const canPrefetch = (routePath) => !isSlowConnection() && !loaded[routePath] && !fetched[routePath];
 const canPreload = (routePath) => !isSlowConnection() && !loaded[routePath];
-const flatten = (arrays) => Array.prototype.concat.apply([], arrays);
 // Remove the last part containing the route hash
 // input: /blog/2018/12/14/Happy-First-Birthday-Slash-fe9
 // output: /blog/2018/12/14/Happy-First-Birthday-Slash
 const removeRouteNameHash = (str) => str.replace(/(-[^-]+)$/, '');
-const getChunkNamesToLoad = (path) => {
-    return flatten(Object.entries(routesChunkNames)
-        .filter(([routeNameWithHash]) => removeRouteNameHash(routeNameWithHash) === path)
-        .map(([, routeChunks]) => {
-        // flat() is useful for nested chunk names, it's not like array.flat()
-        return Object.values(flat(routeChunks));
-    }));
-};
+const getChunkNamesToLoad = (path) => Object.entries(routesChunkNames)
+    .filter(([routeNameWithHash]) => removeRouteNameHash(routeNameWithHash) === path)
+    .flatMap(([, routeChunks]) => 
+// flat() is useful for nested chunk names, it's not like array.flat()
+Object.values(flat(routeChunks)));
 const docusaurus = {
     prefetch: (routePath) => {
         if (!canPrefetch(routePath)) {
@@ -46,12 +38,12 @@ const docusaurus = {
         fetched[routePath] = true;
         // Find all webpack chunk names needed.
         const matches = matchRoutes(routes, routePath);
-        const chunkNamesNeeded = flatten(matches.map((match) => getChunkNamesToLoad(match.route.path)));
+        const chunkNamesNeeded = matches.flatMap((match) => getChunkNamesToLoad(match.route.path));
         // Prefetch all webpack chunk assets file needed.
         chunkNamesNeeded.forEach((chunkName) => {
             // "__webpack_require__.gca" is a custom function provided by ChunkAssetPlugin.
             // Pass it the chunkName or chunkId you want to load and it will return the URL for that chunk.
-            // eslint-disable-next-line no-undef
+            // eslint-disable-next-line camelcase
             const chunkAsset = __webpack_require__.gca(chunkName);
             // In some cases, webpack might decide to optimize further & hence the chunk assets are merged to another chunk/previous chunk.
             // Hence, we can safely filter it out/don't need to load it.