2022-11-24 03:42:03 +00:00
|
|
|
<script setup lang="ts">
|
|
|
|
const props = defineProps<{
|
|
|
|
code: string
|
2022-12-02 02:19:31 +00:00
|
|
|
lang?: string
|
2022-11-24 03:42:03 +00:00
|
|
|
}>()
|
|
|
|
|
2022-11-25 20:19:45 +00:00
|
|
|
const raw = $computed(() => decodeURIComponent(props.code).replace(/'/g, '\''))
|
2022-11-24 03:42:03 +00:00
|
|
|
|
|
|
|
const langMap: Record<string, string> = {
|
|
|
|
js: 'javascript',
|
|
|
|
ts: 'typescript',
|
|
|
|
vue: 'html',
|
|
|
|
}
|
|
|
|
|
2022-11-25 21:09:10 +00:00
|
|
|
const highlighted = computed(() => {
|
2022-12-02 02:19:31 +00:00
|
|
|
return props.lang ? highlightCode(raw, (langMap[props.lang] || props.lang) as any) : raw
|
2022-11-24 03:42:03 +00:00
|
|
|
})
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<template>
|
2022-11-25 21:09:10 +00:00
|
|
|
<pre class="code-block" v-html="highlighted" />
|
2022-11-24 03:42:03 +00:00
|
|
|
</template>
|