Merge branch 'main' into ozaki/execa

packages/docusaurus-utils/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@docusaurus/utils",
-  "version": "3.4.0",
+  "version": "3.7.0",
   "description": "Node utility functions for Docusaurus packages.",
   "main": "./lib/index.js",
   "types": "./lib/index.d.ts",
@@ -18,9 +18,9 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@docusaurus/logger": "3.4.0",
-    "@docusaurus/utils-common": "3.4.0",
-    "@svgr/webpack": "^8.1.0",
+    "@docusaurus/logger": "3.7.0",
+    "@docusaurus/types": "3.7.0",
+    "@docusaurus/utils-common": "3.7.0",
     "escape-string-regexp": "^4.0.0",
     "execa": "5.1.1",
     "file-loader": "^6.2.0",
@@ -44,20 +44,11 @@
     "node": ">=18.0"
   },
   "devDependencies": {
-    "@docusaurus/types": "3.4.0",
     "@types/dedent": "^0.7.0",
     "@types/github-slugger": "^1.3.0",
     "@types/micromatch": "^4.0.2",
     "@types/react-dom": "^18.2.7",
     "dedent": "^0.7.0",
     "tmp-promise": "^3.0.3"
-  },
-  "peerDependencies": {
-    "@docusaurus/types": "*"
-  },
-  "peerDependenciesMeta": {
-    "@docusaurus/types": {
-      "optional": true
-    }
   }
 }

packages/docusaurus-utils/src/__tests__/markdownUtils.test.ts

@@ -1098,7 +1098,7 @@ describe('escapeMarkdownHeadingIds', () => {
 
         ## News {#news}
 
-        For the latest news about Docusaurus, [follow **@docusaurus** on Twitter](https://twitter.com/docusaurus) and the [official Docusaurus blog](/blog) on this website.
+        For the latest news about Docusaurus, [follow **@docusaurus** on X](https://x.com/docusaurus) and the [official Docusaurus blog](/blog) on this website.
     `),
     ).toEqual(dedent`
         # Support
@@ -1128,7 +1128,7 @@ describe('escapeMarkdownHeadingIds', () => {
 
         ## News \{#news}
 
-        For the latest news about Docusaurus, [follow **@docusaurus** on Twitter](https://twitter.com/docusaurus) and the [official Docusaurus blog](/blog) on this website.
+        For the latest news about Docusaurus, [follow **@docusaurus** on X](https://x.com/docusaurus) and the [official Docusaurus blog](/blog) on this website.
     `);
   });
 });

packages/docusaurus-utils/src/__tests__/webpackUtils.test.ts

@@ -1,34 +0,0 @@
-/**
- * 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 {getFileLoaderUtils} from '../webpackUtils';
-
-describe('getFileLoaderUtils()', () => {
-  it('plugin svgo/removeViewBox and removeTitle should be disabled', () => {
-    const {oneOf} = getFileLoaderUtils().rules.svg();
-    expect(oneOf![0]!.use).toContainEqual(
-      expect.objectContaining({
-        loader: require.resolve('@svgr/webpack'),
-        options: expect.objectContaining({
-          svgoConfig: {
-            plugins: [
-              {
-                name: 'preset-default',
-                params: {
-                  overrides: {
-                    removeTitle: false,
-                    removeViewBox: false,
-                  },
-                },
-              },
-            ],
-          },
-        }),
-      }),
-    );
-  });
-});

packages/docusaurus-utils/src/globUtils.ts

@@ -10,8 +10,11 @@
 import path from 'path';
 import Micromatch from 'micromatch'; // Note: Micromatch is used by Globby
 import {addSuffix} from '@docusaurus/utils-common';
+import Globby from 'globby';
+import {posixPath} from './pathUtils';
+
 /** A re-export of the globby instance. */
-export {default as Globby} from 'globby';
+export {Globby};
 
 /**
  * The default glob patterns we ignore when sourcing content.
@@ -85,3 +88,40 @@ export function createAbsoluteFilePathMatcher(
   return (absoluteFilePath: string) =>
     matcher(getRelativeFilePath(absoluteFilePath));
 }
+
+// Globby that fix Windows path patterns
+// See https://github.com/facebook/docusaurus/pull/4222#issuecomment-795517329
+export async function safeGlobby(
+  patterns: string[],
+  options?: Globby.GlobbyOptions,
+): Promise<string[]> {
+  // Required for Windows support, as paths using \ should not be used by globby
+  // (also using the windows hard drive prefix like c: is not a good idea)
+  const globPaths = patterns.map((dirPath) =>
+    posixPath(path.relative(process.cwd(), dirPath)),
+  );
+
+  return Globby(globPaths, options);
+}
+
+// A bit weird to put this here, but it's used by core + theme-translations
+export async function globTranslatableSourceFiles(
+  patterns: string[],
+): Promise<string[]> {
+  // We only support extracting source code translations from these kind of files
+  const extensionsAllowed = new Set([
+    '.js',
+    '.jsx',
+    '.ts',
+    '.tsx',
+    // TODO support md/mdx too? (may be overkill)
+    // need to compile the MDX to JSX first and remove front matter
+    // '.md',
+    // '.mdx',
+  ]);
+
+  const filePaths = await safeGlobby(patterns);
+  return filePaths.filter((filePath) =>
+    extensionsAllowed.has(path.extname(filePath)),
+  );
+}

packages/docusaurus-utils/src/index.ts

@@ -97,6 +97,8 @@ export {md5Hash, simpleHash, docuHash} from './hashUtils';
 export {
   Globby,
   GlobExcludeDefault,
+  safeGlobby,
+  globTranslatableSourceFiles,
   createMatcher,
   createAbsoluteFilePathMatcher,
 } from './globUtils';

packages/docusaurus-utils/src/urlUtils.ts

@@ -211,7 +211,7 @@ export function toURLPath(url: URL): URLPath {
 
 /**
  * Let's name the concept of (pathname + search + hash) as URLPath
- * See also https://twitter.com/kettanaito/status/1741768992866308120
+ * See also https://x.com/kettanaito/status/1741768992866308120
  * Note: this function also resolves relative pathnames while parsing!
  */
 export function parseURLPath(urlPath: string, fromPath?: string): URLPath {

packages/docusaurus-utils/src/webpackUtils.ts

@@ -43,19 +43,20 @@ type FileLoaderUtils = {
   };
   rules: {
     images: () => RuleSetRule;
+    svgs: () => RuleSetRule;
     fonts: () => RuleSetRule;
     media: () => RuleSetRule;
-    svg: () => RuleSetRule;
     otherAssets: () => RuleSetRule;
   };
 };
 
-/**
- * Returns unified loader configurations to be used for various file types.
- *
- * Inspired by https://github.com/gatsbyjs/gatsby/blob/8e6e021014da310b9cc7d02e58c9b3efe938c665/packages/gatsby/src/utils/webpack-utils.ts#L447
- */
-export function getFileLoaderUtils(): FileLoaderUtils {
+// TODO this historical code is quite messy
+//  We should try to get rid of it and move to assets pipeline
+function createFileLoaderUtils({
+  isServer,
+}: {
+  isServer: boolean;
+}): FileLoaderUtils {
   // Files/images < urlLoaderLimit will be inlined as base64 strings directly in
   // the html
   const urlLoaderLimit = WEBPACK_URL_LOADER_LIMIT;
@@ -72,6 +73,7 @@ export function getFileLoaderUtils(): FileLoaderUtils {
       loader: require.resolve(`file-loader`),
       options: {
         name: fileLoaderFileName(options.folder),
+        emitFile: !isServer,
       },
     }),
     url: (options: {folder: AssetFolder}) => ({
@@ -80,6 +82,7 @@ export function getFileLoaderUtils(): FileLoaderUtils {
         limit: urlLoaderLimit,
         name: fileLoaderFileName(options.folder),
         fallback: require.resolve('file-loader'),
+        emitFile: !isServer,
       },
     }),
 
@@ -92,13 +95,19 @@ export function getFileLoaderUtils(): FileLoaderUtils {
       require.resolve('url-loader'),
     )}?limit=${urlLoaderLimit}&name=${fileLoaderFileName(
       'images',
-    )}&fallback=${escapePath(require.resolve('file-loader'))}!`,
+    )}&fallback=${escapePath(require.resolve('file-loader'))}${
+      isServer ? `&emitFile=false` : ''
+    }!`,
     inlineMarkdownAssetImageFileLoader: `!${escapePath(
       require.resolve('file-loader'),
-    )}?name=${fileLoaderFileName('images')}!`,
+    )}?name=${fileLoaderFileName('images')}${
+      isServer ? `&emitFile=false` : ''
+    }!`,
     inlineMarkdownLinkFileLoader: `!${escapePath(
       require.resolve('file-loader'),
-    )}?name=${fileLoaderFileName('files')}!`,
+    )}?name=${fileLoaderFileName('files')}${
+      isServer ? `&emitFile=false` : ''
+    }!`,
   };
 
   const rules: FileLoaderUtils['rules'] = {
@@ -111,6 +120,15 @@ export function getFileLoaderUtils(): FileLoaderUtils {
       test: /\.(?:ico|jpe?g|png|gif|webp|avif)(?:\?.*)?$/i,
     }),
 
+    /**
+     * The SVG rule is isolated on purpose: our SVGR plugin enhances it
+     * See https://github.com/facebook/docusaurus/pull/10820
+     */
+    svgs: () => ({
+      use: [loaders.url({folder: 'images'})],
+      test: /\.svg$/i,
+    }),
+
     fonts: () => ({
       use: [loaders.url({folder: 'fonts'})],
       test: /\.(?:woff2?|eot|ttf|otf)$/i,
@@ -125,46 +143,6 @@ export function getFileLoaderUtils(): FileLoaderUtils {
       test: /\.(?:mp4|avi|mov|mkv|mpg|mpeg|vob|wmv|m4v|webm|ogv|wav|mp3|m4a|aac|oga|flac)$/i,
     }),
 
-    svg: () => ({
-      test: /\.svg$/i,
-      oneOf: [
-        {
-          use: [
-            {
-              loader: require.resolve('@svgr/webpack'),
-              options: {
-                prettier: false,
-                svgo: true,
-                svgoConfig: {
-                  plugins: [
-                    {
-                      name: 'preset-default',
-                      params: {
-                        overrides: {
-                          removeTitle: false,
-                          removeViewBox: false,
-                        },
-                      },
-                    },
-                  ],
-                },
-                titleProp: true,
-                ref: ![path],
-              },
-            },
-          ],
-          // We don't want to use SVGR loader for non-React source code
-          // ie we don't want to use SVGR for CSS files...
-          issuer: {
-            and: [/\.(?:tsx?|jsx?|mdx?)$/i],
-          },
-        },
-        {
-          use: [loaders.url({folder: 'images'})],
-        },
-      ],
-    }),
-
     otherAssets: () => ({
       use: [loaders.file({folder: 'files'})],
       test: /\.(?:pdf|docx?|xlsx?|zip|rar)$/i,
@@ -173,3 +151,16 @@ export function getFileLoaderUtils(): FileLoaderUtils {
 
   return {loaders, rules};
 }
+
+const FileLoaderUtilsMap = {
+  server: createFileLoaderUtils({isServer: true}),
+  client: createFileLoaderUtils({isServer: false}),
+};
+
+/**
+ * Returns unified loader configurations to be used for various file types.
+ * Inspired by https://github.com/gatsbyjs/gatsby/blob/8e6e021014da310b9cc7d02e58c9b3efe938c665/packages/gatsby/src/utils/webpack-utils.ts#L447
+ */
+export function getFileLoaderUtils(isServer: boolean): FileLoaderUtils {
+  return isServer ? FileLoaderUtilsMap.server : FileLoaderUtilsMap.client;
+}