From eb7389abb241b415774798ecc9d45e6b13c16ed8 Mon Sep 17 00:00:00 2001 From: Simon Plenderleith Date: Sat, 17 Sep 2022 19:31:13 +0100 Subject: [PATCH] Add support to Prism for the Astro language This enables syntax highlighting for `astro` code blocks. The `@astro/prism` package is pinned to v1.0.1 as we're importing a module from it that isn't exposed by the package. `prism-include-languages.js` was generated with: ```bash npm run swizzle @docusaurus/theme-classic prism-include-languages ``` See: https://docusaurus.io/docs/markdown-features/code-blocks#supported-languages --- package-lock.json | 20 ++++++++++++++++++++ package.json | 1 + src/theme/prism-include-languages.js | 25 +++++++++++++++++++++++++ 3 files changed, 46 insertions(+) create mode 100644 src/theme/prism-include-languages.js diff --git a/package-lock.json b/package-lock.json index d1e24ef595..ea58130a62 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,7 @@ "name": "platformatic-oss-website", "version": "0.0.1", "dependencies": { + "@astrojs/prism": "^1.0.1", "@docusaurus/core": "2.0.1", "@docusaurus/preset-classic": "2.0.1", "@mdx-js/react": "^1.6.22", @@ -186,6 +187,17 @@ "node": ">=6.0.0" } }, + "node_modules/@astrojs/prism": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@astrojs/prism/-/prism-1.0.1.tgz", + "integrity": "sha512-HxEFslvbv+cfOs51q/C7aMVFuW3EAGg0d1xXU/0e/QeScDzfrp5Ra4SOb8mV082SgENVjtVvet4zR84t3at4VQ==", + "dependencies": { + "prismjs": "^1.28.0" + }, + "engines": { + "node": "^14.18.0 || >=16.12.0" + } + }, "node_modules/@babel/code-frame": { "version": "7.18.6", "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.18.6.tgz", @@ -13214,6 +13226,14 @@ "@jridgewell/trace-mapping": "^0.3.9" } }, + "@astrojs/prism": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@astrojs/prism/-/prism-1.0.1.tgz", + "integrity": "sha512-HxEFslvbv+cfOs51q/C7aMVFuW3EAGg0d1xXU/0e/QeScDzfrp5Ra4SOb8mV082SgENVjtVvet4zR84t3at4VQ==", + "requires": { + "prismjs": "^1.28.0" + } + }, "@babel/code-frame": { "version": "7.18.6", "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.18.6.tgz", diff --git a/package.json b/package.json index 8d136d9900..6dc3dcce7f 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,7 @@ "write-heading-ids": "docusaurus write-heading-ids" }, "dependencies": { + "@astrojs/prism": "1.0.1", "@docusaurus/core": "2.0.1", "@docusaurus/preset-classic": "2.0.1", "@mdx-js/react": "^1.6.22", diff --git a/src/theme/prism-include-languages.js b/src/theme/prism-include-languages.js new file mode 100644 index 0000000000..a20e626b6f --- /dev/null +++ b/src/theme/prism-include-languages.js @@ -0,0 +1,25 @@ +import siteConfig from '@generated/docusaurus.config'; + +export default function prismIncludeLanguages(PrismObject) { + const { + themeConfig: {prism}, + } = siteConfig; + const {additionalLanguages} = prism; + // Prism components work on the Prism instance on the window, while prism- + // react-renderer uses its own Prism instance. We temporarily mount the + // instance onto window, import components to enhance it, then remove it to + // avoid polluting global namespace. + // You can mutate PrismObject: registering plugins, deleting languages... As + // long as you don't re-assign it + globalThis.Prism = PrismObject; + additionalLanguages.forEach((lang) => { + // eslint-disable-next-line global-require, import/no-dynamic-require + require(`prismjs/components/prism-${lang}`); + }); + + // TODO: This is a hack. This can be done properly if Astro agree to the + // package exposing this entrypoint. + require('../../node_modules/@astrojs/prism/dist/plugin.js').addAstro(PrismObject); + + delete globalThis.Prism; +}