fix(v2): linking to asset or external html page -> don't use history.push() (#3347)

* Rework markdown links to asset require processing + add test page

* implement pathname:// protocol / escape hatch at the Link level

* linking to assets: fix tests + avoid creating an useless nested paragraph

* fix assets linking doc

* attempt to fix windows e2e test

* try to fix windows errors
This commit is contained in:
Sébastien Lorber 2020-08-28 12:47:03 +02:00 committed by GitHub
parent bd9b6618c1
commit c7fc781ce0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
21 changed files with 267 additions and 227 deletions

View file

@ -948,12 +948,11 @@ Let's imagine the following file structure:
# Some assets you want to use
/website/docs/assets/docusaurus-asset-example-banner.png
/website/docs/assets/docusaurus-asset-example-pdf.pdf
/website/docs/assets/docusaurus-asset-example.xyz
```
### Image assets
### Images
You can use images by requiring them and using an image tag through MDX:
You can use images in Markdown, or by requiring them and using a JSX image tag:
```mdx
# My markdown page
@ -985,7 +984,7 @@ If you are using [@docusaurus/plugin-ideal-image](./using-plugins.md#docusaurusp
:::
### Common assets
### Files
In the same way, you can link to existing assets by requiring them and using the returned url in videos, links etc...
@ -998,7 +997,7 @@ In the same way, you can link to existing assets by requiring them and using the
Download this PDF !!!
</a>
or
or
[Download this PDF using Markdown !!!](./assets/docusaurus-asset-example-pdf.pdf)
```
@ -1009,53 +1008,18 @@ or
Download this PDF !!!
</a>
[Download this PDF using Markdown !!!](./assets/docusaurus-asset-example-pdf.pdf)
### Unknown assets
This require behavior is not supported for all file extensions, but as an escape hatch you can use the special Webpack syntax to force the `file-loader` to kick-in:
```mdx
# My markdown page
<a
target="_blank"
href={require('!file-loader!./assets/docusaurus-asset-example.xyz').default}>
Download this unknown file !!!
</a>
or
[Download this unknown file using Markdown](!file-loader!./assets/docusaurus-asset-example.xyz)
```
<a
target="_blank"
href={require('!file-loader!./assets/docusaurus-asset-example.xyz').default}>
Download this unknown file !!!
</a>
[Download this unknown file using Markdown !!!](!file-loader!./assets/docusaurus-asset-example.xyz)
```md
[![](./assets/docusaurus-asset-example-banner.png)](./assets/docusaurus-asset-example-pdf.pdf)
```
[![](./assets/docusaurus-asset-example-banner.png)](./assets/docusaurus-asset-example-pdf.pdf)
### Inline SVGs
Docusaurus support inlining SVGs out of the box.
```js
import DocusaurusSvg from './docusaurus.svg';
import DocusaurusSvg from "./docusaurus.svg"
<DocusaurusSvg />
<DocusaurusSvg />;
```
import DocusaurusSvg from "@site/static/img/docusaurus.svg"
import DocusaurusSvg from '@site/static/img/docusaurus.svg';
<DocusaurusSvg />