fix: preserve hash in asset link (#5690)

This commit is contained in:
Alexey Pyltsyn 2021-10-12 17:49:01 +03:00 committed by GitHub
parent b40e45943e
commit 67403b3b65
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 16 additions and 4 deletions

View file

@ -14,7 +14,9 @@ exports[`transformAsset plugin transform md links to <a /> 1`] = `
<a target=\\"_blank\\" href={require('!file-loader?name=assets/files/[name]-[hash].[ext]!./asset.pdf').default}>asset</a> <a target=\\"_blank\\" href={require('!file-loader?name=assets/files/[name]-[hash].[ext]!./asset.pdf').default}>asset</a>
<a target=\\"_blank\\" href={require('!file-loader?name=assets/files/[name]-[hash].[ext]!./asset.pdf').default}title=\\"Title\\">asset</a> <a target=\\"_blank\\" href={require('!file-loader?name=assets/files/[name]-[hash].[ext]!./asset.pdf').default + '#page=2'}>asset with hash</a>
<a target=\\"_blank\\" href={require('!file-loader?name=assets/files/[name]-[hash].[ext]!./asset.pdf').default} title=\\"Title\\">asset</a>
## Heading ## Heading
@ -32,6 +34,8 @@ exports[`transformAsset plugin transform md links to <a /> 1`] = `
<a target=\\"_blank\\" href={require('!file-loader?name=assets/files/[name]-[hash].[ext]!./static/staticAsset.pdf').default}>@site/static/staticAsset.pdf</a> <a target=\\"_blank\\" href={require('!file-loader?name=assets/files/[name]-[hash].[ext]!./static/staticAsset.pdf').default}>@site/static/staticAsset.pdf</a>
<a target=\\"_blank\\" href={require('!file-loader?name=assets/files/[name]-[hash].[ext]!./static/staticAsset.pdf').default + '#page=2'} title=\\"Title\\">@site/static/staticAsset.pdf</a>
<a target=\\"_blank\\" href={require('!file-loader?name=assets/files/[name]-[hash].[ext]!./static/staticAsset.pdf').default}>Just staticAsset.pdf</a>, and <a target=\\"_blank\\" href={require('!file-loader?name=assets/files/[name]-[hash].[ext]!./static/staticAsset.pdf').default}><strong>awesome</strong> staticAsset 2.pdf &#39;It is really &quot;AWESOME&quot;&#39;</a>, but also <a target=\\"_blank\\" href={require('!file-loader?name=assets/files/[name]-[hash].[ext]!./static/staticAsset.pdf').default}>coded <code>staticAsset 3.pdf</code></a> <a target=\\"_blank\\" href={require('!file-loader?name=assets/files/[name]-[hash].[ext]!./static/staticAsset.pdf').default}>Just staticAsset.pdf</a>, and <a target=\\"_blank\\" href={require('!file-loader?name=assets/files/[name]-[hash].[ext]!./static/staticAsset.pdf').default}><strong>awesome</strong> staticAsset 2.pdf &#39;It is really &quot;AWESOME&quot;&#39;</a>, but also <a target=\\"_blank\\" href={require('!file-loader?name=assets/files/[name]-[hash].[ext]!./static/staticAsset.pdf').default}>coded <code>staticAsset 3.pdf</code></a>
<a target=\\"_blank\\" href={require('!file-loader?name=assets/files/[name]-[hash].[ext]!./static/staticAssetImage.png').default}><img alt={\\"Clickable Docusaurus logo\\"} src={require(\\"!url-loader?limit=10000&name=assets/images/[name]-[hash].[ext]&fallback=file-loader!./static/staticAssetImage.png\\").default} /></a> <a target=\\"_blank\\" href={require('!file-loader?name=assets/files/[name]-[hash].[ext]!./static/staticAssetImage.png').default}><img alt={\\"Clickable Docusaurus logo\\"} src={require(\\"!url-loader?limit=10000&name=assets/images/[name]-[hash].[ext]&fallback=file-loader!./static/staticAssetImage.png\\").default} /></a>

View file

@ -4,6 +4,8 @@
[asset](./asset.pdf) [asset](./asset.pdf)
[asset with hash](./asset.pdf#page=2)
[asset](asset.pdf 'Title') [asset](asset.pdf 'Title')
## Heading ## Heading
@ -22,6 +24,8 @@
[@site/static/staticAsset.pdf](@site/static/staticAsset.pdf) [@site/static/staticAsset.pdf](@site/static/staticAsset.pdf)
[@site/static/staticAsset.pdf](@site/static/staticAsset.pdf#page=2 'Title')
[Just staticAsset.pdf](/staticAsset.pdf), and [**awesome** staticAsset 2.pdf 'It is really "AWESOME"'](/staticAsset.pdf), but also [coded `staticAsset 3.pdf`](/staticAsset.pdf) [Just staticAsset.pdf](/staticAsset.pdf), and [**awesome** staticAsset 2.pdf 'It is really "AWESOME"'](/staticAsset.pdf), but also [coded `staticAsset 3.pdf`](/staticAsset.pdf)
[![Clickable Docusaurus logo](./static/staticAssetImage.png)](/staticAssetImage.png) [![Clickable Docusaurus logo](./static/staticAssetImage.png)](/staticAssetImage.png)

View file

@ -23,6 +23,7 @@ import type {Link, Literal} from 'mdast';
const { const {
loaders: {inlineMarkdownLinkFileLoader}, loaders: {inlineMarkdownLinkFileLoader},
} = getFileLoaderUtils(); } = getFileLoaderUtils();
const hashRegex = /#.*$/;
interface PluginOptions { interface PluginOptions {
filePath: string; filePath: string;
@ -56,6 +57,9 @@ function toAssetRequireNode({
let relativeRequireAssetPath = posixPath( let relativeRequireAssetPath = posixPath(
path.relative(path.dirname(filePath), requireAssetPath), path.relative(path.dirname(filePath), requireAssetPath),
); );
const hash = hashRegex.test(node.url)
? node.url.substr(node.url.indexOf('#'))
: '';
// nodejs does not like require("assets/file.pdf") // nodejs does not like require("assets/file.pdf")
relativeRequireAssetPath = relativeRequireAssetPath.startsWith('.') relativeRequireAssetPath = relativeRequireAssetPath.startsWith('.')
@ -64,9 +68,9 @@ function toAssetRequireNode({
const href = `require('${inlineMarkdownLinkFileLoader}${escapePath( const href = `require('${inlineMarkdownLinkFileLoader}${escapePath(
relativeRequireAssetPath, relativeRequireAssetPath,
)}').default`; )}').default${hash ? ` + '${hash}'` : ''}`;
const children = stringifyContent(node); const children = stringifyContent(node);
const title = node.title ? `title="${escapeHtml(node.title)}"` : ''; const title = node.title ? ` title="${escapeHtml(node.title)}"` : '';
(node as unknown as Literal).type = 'jsx'; (node as unknown as Literal).type = 'jsx';
( (
@ -82,7 +86,7 @@ async function convertToAssetLinkIfNeeded({
staticDir, staticDir,
filePath, filePath,
}: {node: Link} & PluginOptions) { }: {node: Link} & PluginOptions) {
const assetPath = node.url; const assetPath = node.url.replace(hashRegex, '');
const hasSiteAlias = assetPath.startsWith('@site/'); const hasSiteAlias = assetPath.startsWith('@site/');
const hasAssetLikeExtension = const hasAssetLikeExtension =