extract createBuildClientConfig to client.ts

facebook · Feb 1, 2024 · 258ec2d · 258ec2d
1 parent fabf483
commit 258ec2d
Show file tree

Hide file tree

Showing 2 changed files with 50 additions and 26 deletions.
diff --git a/packages/docusaurus/src/commands/build.ts b/packages/docusaurus/src/commands/build.ts
@@ -10,20 +10,16 @@ import path from 'path';
 import _ from 'lodash';
 import logger from '@docusaurus/logger';
 import {DOCUSAURUS_VERSION, mapAsyncSequential} from '@docusaurus/utils';
-import ReactLoadableSSRAddon from 'react-loadable-ssr-addon-v5-slorber';
-import {BundleAnalyzerPlugin} from 'webpack-bundle-analyzer';
-import merge from 'webpack-merge';
 import {load, loadContext, type LoadContextOptions} from '../server';
 import {handleBrokenLinks} from '../server/brokenLinks';
 
-import createClientConfig from '../webpack/client';
+import {createBuildClientConfig} from '../webpack/client';
 import createServerConfig from '../webpack/server';
 import {
   applyConfigurePostCss,
   applyConfigureWebpack,
   compile,
 } from '../webpack/utils';
-import CleanWebpackPlugin from '../webpack/plugins/CleanWebpackPlugin';
 import {loadI18n} from '../server/i18n';
 import {generateStaticFiles} from '../ssg';
 import ssrDefaultTemplate from '../webpack/templates/ssr.html.template';
@@ -150,28 +146,16 @@ async function buildLocale({
   });
 
   // Apply user webpack config.
-  const {outDir, generatedFilesDir, plugins} = props;
+  const {outDir, plugins} = props;
 
-  const clientManifestPath = path.join(
-    generatedFilesDir,
-    'client-manifest.json',
-  );
-  let clientConfig: Configuration = merge(
-    await createClientConfig(props, cliOptions.minify, true),
-    {
-      plugins: [
-        // Remove/clean build folders before building bundles.
-        new CleanWebpackPlugin({verbose: false}),
-        // Visualize size of webpack output files with an interactive zoomable
-        // tree map.
-        cliOptions.bundleAnalyzer && new BundleAnalyzerPlugin(),
-        // Generate client manifests file that will be used for server bundle.
-        new ReactLoadableSSRAddon({
-          filename: clientManifestPath,
-        }),
-      ].filter(<T>(x: T | undefined | false): x is T => Boolean(x)),
-    },
-  );
+  const res = await createBuildClientConfig({
+    props,
+    minify: cliOptions.minify,
+    bundleAnalyzer: cliOptions.bundleAnalyzer,
+  });
+  // TODO awkward, refactor
+  let {clientConfig} = res;
+  const {clientManifestPath} = res;
 
   let serverConfig: Configuration = await createServerConfig({
     props,

diff --git a/packages/docusaurus/src/webpack/client.ts b/packages/docusaurus/src/webpack/client.ts
@@ -10,9 +10,12 @@ import logger from '@docusaurus/logger';
 import merge from 'webpack-merge';
 import WebpackBar from 'webpackbar';
 import {DefinePlugin} from 'webpack';
+import {BundleAnalyzerPlugin} from 'webpack-bundle-analyzer';
+import ReactLoadableSSRAddon from 'react-loadable-ssr-addon-v5-slorber';
 import {createBaseConfig} from './base';
 import ChunkAssetPlugin from './plugins/ChunkAssetPlugin';
 import {formatStatsErrorMessage} from './utils';
+import CleanWebpackPlugin from './plugins/CleanWebpackPlugin';
 import type {Props} from '@docusaurus/types';
 import type {Configuration} from 'webpack';
 
@@ -68,3 +71,40 @@ export default async function createClientConfig(
 
   return clientConfig;
 }
+
+export async function createBuildClientConfig({
+  props,
+  minify,
+  bundleAnalyzer,
+}: {
+  props: Props;
+  minify?: boolean;
+  bundleAnalyzer?: boolean;
+}): Promise<{clientConfig: Configuration; clientManifestPath: string}> {
+  // Apply user webpack config.
+  const {generatedFilesDir} = props;
+
+  const clientManifestPath = path.join(
+    generatedFilesDir,
+    'client-manifest.json',
+  );
+
+  const clientConfig: Configuration = merge(
+    await createClientConfig(props, minify, true),
+    {
+      plugins: [
+        // Remove/clean build folders before building bundles.
+        new CleanWebpackPlugin({verbose: false}),
+        // Visualize size of webpack output files with an interactive zoomable
+        // tree map.
+        bundleAnalyzer && new BundleAnalyzerPlugin(),
+        // Generate client manifests file that will be used for server bundle.
+        new ReactLoadableSSRAddon({
+          filename: clientManifestPath,
+        }),
+      ].filter(<T>(x: T | undefined | false): x is T => Boolean(x)),
+    },
+  );
+
+  return {clientConfig, clientManifestPath};
+}