mirror of
https://github.com/facebook/docusaurus.git
synced 2025-08-02 08:19:07 +02:00
docs(v2): add docs on static assets (#1648)
* docs(v2 ): add docs on static assets * Update static-assets.md
This commit is contained in:
parent
b2558ac379
commit
295ee65bf8
1 changed files with 34 additions and 9 deletions
|
@ -3,15 +3,40 @@ id: static-assets
|
|||
title: Static Assets
|
||||
---
|
||||
|
||||
_This section is a work in progress. [Welcoming PRs](https://github.com/facebook/docusaurus/issues/1640)._
|
||||
In general, every website needs assets: images, stylesheets, favicons and etc. In such cases,
|
||||
you can create a folder named `static` at the root of your project. Every file you put into that folder will be copied into the generated build folder. E.g. if you add a file named `sun.jpg` to the static folder, it’ll be copied to `build/sun.jpg`
|
||||
|
||||
A "how-to" guide on including static assets within pages and docs.
|
||||
This means that if the site's baseUrl is `/`, an image in `static/img/docusaurus_keytar.svg` is available at `docusaurus_keytar.svg`.
|
||||
|
||||
<!--
|
||||
### Images
|
||||
### Videos
|
||||
|
||||
**References**
|
||||
- https://v1.vuepress.vuejs.org/guide/assets.html
|
||||
- https://www.gatsbyjs.org/docs/images-and-files/
|
||||
-->
|
||||
## Referencing your static asset
|
||||
|
||||
You can reference assets from the static folder in your code with absolute path, i.e. starting with a slash /.
|
||||
|
||||
Markdown example:
|
||||
|
||||
```markdown
|
||||
<!-- reference static/img/docusaurus.png -->
|
||||

|
||||
```
|
||||
|
||||
Result:
|
||||
|
||||

|
||||
|
||||
JSX example:
|
||||
|
||||
```jsx
|
||||
// reference static/img/slash-birth.png
|
||||
<img src="/img/slash-birth.png" alt="docusaurus mascot" />
|
||||
```
|
||||
|
||||
Result:
|
||||
|
||||
<img src="/img/slash-birth.png" alt="docusaurus mascot" />
|
||||
|
||||
|
||||
Keep in mind that:
|
||||
|
||||
- None of the files in static folder will be post-processed or minified.
|
||||
- Missing files will not be called at compilation time, and will cause 404 errors for your users.
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue