@mingyunsnpm/highlight

代码高亮插件

代码高亮插件，React 和 vue 都可以使用，支持javascript json html css sql bash nginx 高亮

组件示例

import '@mingyunsnpm/highlight/build/style.css'
import ReactDOM from 'react-dom/client'
import Highlight from '@mingyunsnpm/highlight'

function App() {
  return (
    <Highlight>
      <pre>
        <code>console.log('test')</code>
      </pre>
    </Highlight>
  )
}

ReactDOM.createRoot(document.getElementById('root')!).render(<App />)

hooks 示例

import '@mingyunsnpm/highlight/build/style.css'
import ReactDOM from 'react-dom/client'
import { useHighlight } from '@mingyunsnpm/highlight'

function App() {
  useHighlight()
  return (
    <div className="container mx-auto">
      <pre>
        <code>console.log('test')</code>
      </pre>
    </div>
  )
}

ReactDOM.createRoot(document.getElementById('root')!).render(<App />)

方法调用示例

import '@mingyunsnpm/highlight/build/style.css'
import { highlight } from '@mingyunsnpm/highlight'

window.onload = function () {
  highlight()
}