diff --git a/packages/docusaurus-mdx-loader/src/loader.ts b/packages/docusaurus-mdx-loader/src/loader.ts index 7b428646c74c..fab2f63ab9d3 100644 --- a/packages/docusaurus-mdx-loader/src/loader.ts +++ b/packages/docusaurus-mdx-loader/src/loader.ts @@ -28,7 +28,7 @@ import type {LoaderContext} from 'webpack'; type Pluggable = any; // TODO fix this asap const { - loaders: {inlineMarkdownImageFileLoader}, + loaders: {inlineMarkdownAssetImageFileLoader}, } = getFileLoaderUtils(); export type MDXPlugin = Pluggable; @@ -92,8 +92,9 @@ function createAssetsExportCode(assets: unknown) { if (typeof assetValue === 'string' && assetValue.startsWith('./')) { // TODO do we have other use-cases than image assets? // Probably not worth adding more support, as we want to move to Webpack 5 new asset system (https://github.com/facebook/docusaurus/pull/4708) - const inlineLoader = inlineMarkdownImageFileLoader; - return `require("${inlineLoader}${escapePath(assetValue)}").default`; + return `require("${inlineMarkdownAssetImageFileLoader}${escapePath( + assetValue, + )}").default`; } return undefined; } diff --git a/packages/docusaurus-utils/src/webpackUtils.ts b/packages/docusaurus-utils/src/webpackUtils.ts index c73193da1cd4..c1195d5764b3 100644 --- a/packages/docusaurus-utils/src/webpackUtils.ts +++ b/packages/docusaurus-utils/src/webpackUtils.ts @@ -20,6 +20,7 @@ type FileLoaderUtils = { file: (options: {folder: AssetFolder}) => RuleSetRule; url: (options: {folder: AssetFolder}) => RuleSetRule; inlineMarkdownImageFileLoader: string; + inlineMarkdownAssetImageFileLoader: string; inlineMarkdownLinkFileLoader: string; }; rules: { @@ -74,6 +75,9 @@ export function getFileLoaderUtils(): FileLoaderUtils { )}?limit=${urlLoaderLimit}&name=${fileLoaderFileName( 'images', )}&fallback=${escapePath(require.resolve('file-loader'))}!`, + inlineMarkdownAssetImageFileLoader: `!${escapePath( + require.resolve('file-loader'), + )}?name=${fileLoaderFileName('images')}!`, inlineMarkdownLinkFileLoader: `!${escapePath( require.resolve('file-loader'), )}?name=${fileLoaderFileName('files')}!`,