Describe the bug
感谢作者的共享，vue-codemirror 确实是一个很好的项目。
但是我在vue3项目中使用时遇到了一些问题，下面是我写的代码：
引入依赖：
运行不会报错，只要打开使用了codemirror的页面时会报错：
`import { Codemirror } from 'vue-codemirror'
import { oneDark } from '@codemirror/theme-one-dark'
import { json } from '@codemirror/lang-json'
`
Reproduction
`
<script setup lang="ts">
import type { CSSProperties } from 'vue'
import { ref, watchEffect } from 'vue'
import { Codemirror } from 'vue-codemirror'
import { oneDark } from '@codemirror/theme-one-dark'
import { json } from '@codemirror/lang-json'
interface Props {
codeStyle?: CSSProperties // 代码样式
dark?: boolean // 是否暗黑主题
code?: string // 代码字符串
}
const props = withDefaults(defineProps(), {
codeStyle: () => ({}),
dark: false,
code: ''
})
const extensions = props.dark ? [json(), oneDark] : [json()]
const codeValue = ref('')
watchEffect(() => {
codeValue.value = props.code
})
const emits = defineEmits(['update:code', 'ready', 'change', 'focus', 'blur'])
function handleReady(payload: any) {
// console.log('ready')
emits('ready', payload)
}
function onChange(value: string, viewUpdate: any) {
emits('change', value, viewUpdate)
emits('update:code', value)
}
function onBlur(viewUpdate: any) {
emits('blur', viewUpdate)
}
</script>
`
System Info
Used Package Manager
pnpm
Validations
Describe the bug
感谢作者的共享，vue-codemirror 确实是一个很好的项目。
但是我在vue3项目中使用时遇到了一些问题，下面是我写的代码：
引入依赖：
运行不会报错，只要打开使用了codemirror的页面时会报错：
`import { Codemirror } from 'vue-codemirror'
`import { oneDark } from '@codemirror/theme-one-dark'
import { json } from '@codemirror/lang-json'
Reproduction
`
<script setup lang="ts"> import type { CSSProperties } from 'vue' import { ref, watchEffect } from 'vue' import { Codemirror } from 'vue-codemirror' import { oneDark } from '@codemirror/theme-one-dark' import { json } from '@codemirror/lang-json' interface Props { codeStyle?: CSSProperties // 代码样式 dark?: boolean // 是否暗黑主题 code?: string // 代码字符串 } const props = withDefaults(defineProps(), { codeStyle: () => ({}), dark: false, code: '' }) const extensions = props.dark ? [json(), oneDark] : [json()] const codeValue = ref('') watchEffect(() => { codeValue.value = props.code }) const emits = defineEmits(['update:code', 'ready', 'change', 'focus', 'blur']) function handleReady(payload: any) { // console.log('ready') emits('ready', payload) } function onChange(value: string, viewUpdate: any) { emits('change', value, viewUpdate) emits('update:code', value) } function onBlur(viewUpdate: any) { emits('blur', viewUpdate) } </script>`
System Info
Used Package Manager
pnpm
Validations