shiki with proper transpilation

This commit is contained in:
Nate Kelley 2025-07-22 16:29:21 -06:00
parent 10be9b41b7
commit 3520bd9111
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
3 changed files with 9 additions and 3 deletions

View File

@ -72,6 +72,8 @@ const createCspHeader = (isEmbed = false) => {
/** @type {import('next').NextConfig} */ /** @type {import('next').NextConfig} */
const nextConfig = { const nextConfig = {
reactStrictMode: false, reactStrictMode: false,
// Transpile ESM packages
transpilePackages: ['shiki'],
// ESLint configuration // ESLint configuration
eslint: { eslint: {
ignoreDuringBuilds: false, ignoreDuringBuilds: false,

View File

@ -1,4 +1,6 @@
import React, { useEffect, useState, useRef } from 'react'; 'use client';
import React, { useEffect, useState } from 'react';
import { cn } from '@/lib/classMerge'; import { cn } from '@/lib/classMerge';
import { getCodeTokens } from './shiki-instance'; import { getCodeTokens } from './shiki-instance';
import styles from './SyntaxHighlighter.module.css'; import styles from './SyntaxHighlighter.module.css';

View File

@ -1,5 +1,7 @@
import { createHighlighterCore, HighlighterCore } from 'shiki/core'; 'use client';
import type { ShikiTransformer } from 'shiki';
import type { ShikiTransformer, HighlighterCore } from 'shiki';
import { createHighlighterCore } from 'shiki/core';
import { createOnigurumaEngine } from 'shiki/engine/oniguruma'; import { createOnigurumaEngine } from 'shiki/engine/oniguruma';
import githubLight from '@shikijs/themes/github-light'; import githubLight from '@shikijs/themes/github-light';
import githubDark from '@shikijs/themes/github-dark'; import githubDark from '@shikijs/themes/github-dark';