Skip to content

Commit

Permalink
fix: fix images by disabled ideal-image
Browse files Browse the repository at this point in the history
Also enable image zoom, which is the only reason I wanted ideal-image,
which it turns out ideal image doesn't even do.
  • Loading branch information
dwmkerr committed Apr 19, 2022
1 parent ef09cae commit 239f0eb
Show file tree
Hide file tree
Showing 7 changed files with 44 additions and 451 deletions.
3 changes: 3 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -34,3 +34,6 @@ yarn-debug.log*
yarn-error.log*

# End of Docusaurus ignores

# Ignore Draw.io backups.
*.bkp
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ chapterNumber: 32
---

import CodeBlock from '@theme/CodeBlock';
import Image from '@theme/IdealImage';
import AnnotatedCommand from '@site/src/components/AnnotatedCommmand/AnnotatedCommand.tsx';
import Caret from '@site/src/components/Caret/Caret.tsx';

Expand Down
13 changes: 12 additions & 1 deletion docs/zz-developer-guide/images-and-diagrams.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,16 @@
title: Images and Diagrams
---

import Image from '@theme/IdealImage';
import Drawio from '@theme/Drawio'

## Images

:::info Not in Use

Ideal Image is not currently enabled as it appears to clash with native Docusaurus lazy-loading.

:::

The [`@docusaurus/plugin-ideal-image`](https://docusaurus.io/docs/api/plugins/@docusaurus/plugin-ideal-image) is used to allow lazy loading and zoom of images.

Use the `Image` tag as shown:
Expand All @@ -18,7 +23,13 @@ import Image from '@theme/IdealImage';

This will render an image as shown below:

::: warn Currently Disabled

```
<Image img={require('./images/vim-cheatsheet.png')} />
```

:::

## Diagrams

Expand Down
16 changes: 11 additions & 5 deletions docusaurus.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -157,12 +157,18 @@ const config = {
{}
],
[
require.resolve('@docusaurus/plugin-ideal-image'),
{
// Enable this plugin in dev so that we can test it.
disableInDev: false,
},
require.resolve('plugin-image-zoom'),
{}
],
// Ideal Image seems to clash with Docusaurus native lazy loading, causing
// most images not to load. So disabling this for now.
// [
// require.resolve('@docusaurus/plugin-ideal-image'),
// {
// // Enable this plugin in dev so that we can test it.
// disableInDev: false,
// },
// ],
],
};

Expand Down
Loading

0 comments on commit 239f0eb

Please sign in to comment.