Skip to content

Commit 0e467af

Browse files
authored
fix: add ts and json mode (#37)
1 parent c8b1b8a commit 0e467af

File tree

2 files changed

+26
-7
lines changed

2 files changed

+26
-7
lines changed

src/codemirror/CodeMirror.vue

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,13 @@
33
</template>
44

55
<script setup lang="ts">
6+
import type { ModeSpec, ModeSpecOptions } from 'codemirror'
67
import { ref, onMounted, watchEffect, inject } from 'vue'
78
import { debounce } from '../utils'
89
import CodeMirror from './codemirror'
910
1011
export interface Props {
11-
mode?: string
12+
mode?: string | ModeSpec<ModeSpecOptions>
1213
value?: string
1314
readonly?: boolean
1415
}

src/editor/Editor.vue

Lines changed: 24 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,42 @@
11
<script setup lang="ts">
22
import FileSelector from './FileSelector.vue'
3-
import CodeMirror from '../codemirror/CodeMirror.vue'
3+
import CodeMirror, { type Props } from '../codemirror/CodeMirror.vue'
44
import Message from '../Message.vue'
55
import { debounce } from '../utils'
66
import { computed, inject } from 'vue'
77
import { Store } from '../store'
88
99
const store = inject('store') as Store
1010
11+
const modes: Record<string, Props['mode']> = {
12+
css: 'css',
13+
html: 'htmlmixed',
14+
js: {
15+
name: 'javascript',
16+
},
17+
json: {
18+
name: 'javascript',
19+
json: true,
20+
},
21+
ts: {
22+
name: 'javascript',
23+
typescript: true,
24+
},
25+
vue: 'htmlmixed',
26+
}
27+
1128
const onChange = debounce((code: string) => {
1229
store.state.activeFile.code = code
1330
}, 250)
1431
1532
const activeMode = computed(() => {
1633
const { filename } = store.state.activeFile
17-
return filename.endsWith('.vue') || filename.endsWith('.html')
18-
? 'htmlmixed'
19-
: filename.endsWith('.css')
20-
? 'css'
21-
: 'javascript'
34+
35+
const mode = modes[filename.split('.').pop()!]
36+
37+
return filename.lastIndexOf('.') !== -1 && mode
38+
? mode
39+
: modes.js
2240
})
2341
</script>
2442

0 commit comments

Comments
 (0)