chore: bump docusaurus, use docusaurus/preset-classic #4960
Conversation
|
Thanks for the PR, @Josh-Cena! typescript-eslint is a 100% community driven project, and we are incredibly grateful that you are contributing to that community. The core maintainers work on this in their personal time, so please understand that it may not be possible for them to review your work immediately. Thanks again! 🙏 Please, if you or your company is finding typescript-eslint valuable, help us sustain the project by sponsoring it transparently on https://opencollective.com/typescript-eslint. As a thank you, your profile/company logo will be added to our main README which receives thousands of unique visitors per day. |
✅ Deploy Preview for typescript-eslint ready!
To edit notification comments on pull requests, go to your Netlify site settings. |
| /** @type {import('@docusaurus/preset-classic').Options} */ | ||
| ({ |
There was a problem hiding this comment.
JSDoc only works if you wrap the object literal with brackets. In the latest version, we've added actual JSDoc documentation to all APIs, so it's good if we can do it properly.
| @@ -60,17 +61,7 @@ html[data-theme='dark']:root { | |||
| scrollbar-color: #454a4d #202324; | |||
|
|
|||
| --docsearch-muted-color: #aaa; | |||
| } | |||
|
|
|||
| .docusaurus-highlight-code-line { | |||
There was a problem hiding this comment.
This is a breaking change: the class name has been removed in Docusaurus. We are using CSS vars instead. But AFAIK it won't impact us because it seems we are not using code line highlighting.
| @@ -56,8 +56,8 @@ html[data-theme='dark'] { | |||
| --token-color-highlight: rgba(247, 235, 198, 0.2); | |||
| } | |||
|
|
|||
| div[class*='codeBlockContainer'], | |||
| div[class*='codeBlockContainer'] pre { | |||
| .theme-code-block, | |||
There was a problem hiding this comment.
This is a more stable class name and is recommended.
| export default function prismIncludeLanguages(PrismObject) { | ||
| const { | ||
| themeConfig: { prism }, | ||
| } = siteConfig; | ||
| const { additionalLanguages } = prism; | ||
| globalThis.Prism = PrismObject; | ||
|
|
||
| additionalLanguages.forEach(lang => { | ||
| require(`prismjs/components/prism-${lang}`); // eslint-disable-line | ||
| }); | ||
| additionalLanguages.forEach(lang => { | ||
| require(`prismjs/components/prism-${lang}`); // eslint-disable-line | ||
| }); | ||
|
|
||
| require(`../prism/language/jsonc`); | ||
| delete window.Prism; | ||
| } | ||
| }; | ||
|
|
||
| export default prismIncludeLanguages; | ||
| require(`../prism/language/jsonc`); | ||
| delete globalThis.Prism; | ||
| } |
There was a problem hiding this comment.
Backporting changes from upstream. By using globalThis, we can now support server-side rendering of custom languages as well.
Codecov Report
@@ Coverage Diff @@
## main #4960 +/- ##
==========================================
- Coverage 92.64% 91.78% -0.86%
==========================================
Files 190 228 +38
Lines 10251 10633 +382
Branches 3249 3289 +40
==========================================
+ Hits 9497 9760 +263
- Misses 502 591 +89
- Partials 252 282 +30
Flags with carried forward coverage won't be shown. Click here to find out more.
|
089d1cb to
feac4f8
Compare
|
I think the reason why Cypress tests always fail on version bump PRs is because the cache is invalidated, causing |
| background-color: var(--token-background); | ||
| .theme-code-block, | ||
| .theme-code-block pre { | ||
| color: var(--token-color) !important; |
There was a problem hiding this comment.
This is to work around a Docusaurus bug: facebook/docusaurus#3678
I'd still recommend to use the theme-code-block class name, even if it means using !important...
| if (typeof window !== 'undefined') { | ||
| import ExecutionEnvironment from '@docusaurus/ExecutionEnvironment'; | ||
|
|
||
| if (ExecutionEnvironment.canUseDOM) { |
There was a problem hiding this comment.
Ha, I remember bumping into this discussion! Glad it's resolved 🙂
There was a problem hiding this comment.
Except that ExecutionEnvironment.canUseDOM does exactly the same thing as typeof window !== 'undefined' (except doing a few more checks) 🤦♂️
It's now officially made its way to the docs, now that client modules are finalized and published: https://docusaurus.io/docs/advanced/client#:~:text=remember%20to%20check%20the%20execution%20environment
PR Checklist
Overview
Since we are considering adding a blog (#4957), we will be enjoying all features that preset-classic provides by then. It will be sensible for us to use the preset instead, so we don't need to manage so many dependencies individually.
There are no breaking changes that impact us, but I've made a few little refactors.