feat: use nuxt-shiki

package.json

@@ -76,6 +76,7 @@
  "hast-util-to-string": "^3.0.0",
  "mdast-util-to-hast": "^13.1.0",
  "micromark-util-sanitize-uri": "^2.0.0",
+ "nuxt-shiki": "^0.2.1",
  "ohash": "^1.1.3",
  "parse5": "^7.1.2",
  "pathe": "^1.1.2",
@@ -95,8 +96,7 @@
  "ufo": "^1.4.0",
  "unified": "^11.0.4",
  "unist-builder": "^4.0.0",
- "unist-util-visit": "^5.0.0",
- "unwasm": "^0.3.7"
+ "unist-util-visit": "^5.0.0"
  },
  "devDependencies": {
  "@nuxt/devtools": "latest",

src/module.ts

@@ -1,4 +1,4 @@
-import { defineNuxtModule, extendViteConfig, addComponent, addComponentsDir, createResolver, addServerHandler, addTemplate, addImports, addServerImports, useNitro } from '@nuxt/kit'
+import { defineNuxtModule, extendViteConfig, addComponent, addComponentsDir, createResolver, addServerHandler, addTemplate, addImports, addServerImports, installModule } from '@nuxt/kit'
 import fs from 'fs'
 import type { ModuleOptions } from './types'
 import { defu } from 'defu'
@@ -63,26 +63,12 @@ export default defineNuxtModule<ModuleOptions>({
  })
 
  if (options.highlight) {
- // Enable unwasm for shiki
- nuxt.hook('ready', () => {
- const nitro = useNitro()
- const addWasmSupport = (_nitro: typeof nitro) => {
- if (nitro.options.experimental?.wasm) { return }
- _nitro.options.externals = _nitro.options.externals || {}
- _nitro.options.externals.inline = _nitro.options.externals.inline || []
- _nitro.options.externals.inline.push(id => id.endsWith('.wasm'))
- _nitro.hooks.hook('rollup:before', async (_, rollupConfig) => {
- const { rollup: unwasm } = await import('unwasm/plugin')
- rollupConfig.plugins = rollupConfig.plugins || []
- ; (rollupConfig.plugins as any[]).push(unwasm({
- ..._nitro.options.wasm as any,
- }))
- })
- }
- addWasmSupport(nitro)
- nitro.hooks.hook('prerender:init', (prerenderer) => {
- addWasmSupport(prerenderer)
- })
+ // Install nuxt-shiki
+ // @see https://github.com/pi0/nuxt-shiki#nuxt-shiki
+ installModule('nuxt-shiki', {
+ bundledThemes: options.highlight.themes,
+ bundledLangs: options.highlight.langs,
+ defaultTheme: options.highlight.theme,
  })
 
  // Add server handlers
@@ -243,6 +229,10 @@ function resolveOptions(options: ModuleOptions) {
  default: 'github-light',
  dark: 'github-dark'
  }
+ options.highlight.themes = [
+ ...(options.highlight.themes || []),
+ ...Object.values(options.highlight.theme) as any
+ ]
  options.highlight.langs ||= DefaultHighlightLangs
 
  if (options.highlight.preload) {

src/runtime/highlighter/shiki.ts

@@ -1,4 +1,4 @@
-import { getHighlighterCore, addClassToHast, isSpecialLang, isSpecialTheme } from 'shiki/core'
+import { addClassToHast, isSpecialLang, isSpecialTheme } from 'shiki/core'
 import type { HighlighterCore, LanguageInput, ShikiTransformer, ThemeInput } from 'shiki'
 import type { Highlighter } from './types'
 import type { Element } from 'hast'
@@ -9,6 +9,9 @@ import {
  transformerNotationHighlight,
 } from '@shikijs/transformers'
 import type { MdcConfig } from '../types/config'
+// @ts-expect-error - `nuxt-shiki` is installed by the module.
+import { loadShiki } from '#imports'
+import type { ShikiInstance } from 'nuxt-shiki/dist/runtime/types'
 
 export interface CreateShikiHighlighterOptions {
  /* An array of themes to be loaded initially */
@@ -26,8 +29,6 @@ export interface CreateShikiHighlighterOptions {
 }
 
 export function createShikiHighlighter({
- langs = [],
- themes = [],
  bundledLangs = {},
  bundledThemes = {},
  getMdcConfigs,
@@ -37,11 +38,7 @@ export function createShikiHighlighter({
  let configs: Promise<MdcConfig[]> | undefined
 
  async function _getShiki() {
- const shiki = await getHighlighterCore({
- langs,
- themes,
- loadWasm: () => import('shiki/wasm')
- })
+ const shiki = await loadShiki() as ShikiInstance
 
  for await (const config of await getConfigs()) {
  await config.shiki?.setup?.(shiki)