Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 84d95b4

Browse files
feat: syntax-highlight (#1)
1 parent 17c1619 commit 84d95b4

19 files changed

+2755
-1
lines changed

‎.gitignore‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
dist
12+
dist-ssr
13+
*.local
14+
15+
# Editor directories and files
16+
.vscode/*
17+
!.vscode/extensions.json
18+
.idea
19+
.DS_Store
20+
*.suo
21+
*.ntvs*
22+
*.njsproj
23+
*.sln
24+
*.sw?

‎.npmrc‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
auto-install-peers=true
2+
strict-peer-dependencies=false

‎.prettierignore‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
__build__
2+
dist
3+
coverage
4+
auto-imports.d.ts

‎.prettierrc‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"semi": false,
3+
"trailingComma": "es5",
4+
"singleQuote": true
5+
}

‎README.md‎

Lines changed: 54 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,55 @@
11
# syntax-highlight
2-
Syntax highlight component for vue-termui.
2+
3+
Syntax highlight component for [vue-termui](https://github.com/vue-terminal/vue-termui).
4+
5+
<div align="center">
6+
<br>
7+
<br>
8+
<img width="380" src="./example.gif">
9+
<br>
10+
<br>
11+
<br>
12+
</div>
13+
14+
## Install
15+
16+
```shell
17+
npm install @vue-termui/syntax-highlight
18+
```
19+
20+
## Usage
21+
22+
```html
23+
<script lang="ts" setup>
24+
improt { TuiBox } from 'vue-termui'
25+
import SyntaxHighlight from '@vue-termui/syntax-highlight'
26+
27+
const code = `const hello = 'world'`
28+
</script>
29+
30+
<template>
31+
<TuiBox>
32+
<SyntaxHighlight :code="code" />
33+
</TuiBox>
34+
</template>
35+
```
36+
37+
## Props
38+
39+
### code
40+
41+
- Type: `string`
42+
43+
Source code to highlight.
44+
45+
### lang
46+
47+
- Type: `string`
48+
49+
Language of the source code. If you don't set it yourself, this component will try to auto-detect it. [All languages of highlight.js](https://github.com/highlightjs/highlight.js/blob/master/SUPPORTED_LANGUAGES.md#supported-languages) are supported.
50+
51+
### theme
52+
53+
- Type: [Theme](https://github.com/felixfbecker/cli-highlight/blob/main/src/theme.ts#L280)<br>
54+
55+
You can write your custom theme and pass it as a prop. [More info regarding custom theme](https://github.com/felixfbecker/cli-highlight/blob/main/README.md#themes).

‎example.gif‎

274 KB
Loading[フレーム]

‎package.json‎

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
{
2+
"name": "@vue-termui/syntax-highlight",
3+
"version": "0.0.2",
4+
"description": "Syntax highlight component for vue-termui.",
5+
"type": "module",
6+
"main": "./dist/index.cjs",
7+
"module": "./dist/index.mjs",
8+
"types": "./dist/index.d.ts",
9+
"packageManager": "pnpm@7.12.2",
10+
"scripts": {
11+
"build": "tsup",
12+
"play:dev": "pnpm run --filter './playground' dev",
13+
"play:build": "pnpm run --filter './playground' build",
14+
"lint": "prettier --check .",
15+
"lint:fix": "prettier --write ."
16+
},
17+
"repository": {
18+
"type": "git",
19+
"url": "git+https://github.com/vue-terminal/syntax-highlight.git"
20+
},
21+
"exports": {
22+
".": {
23+
"import": "./dist/index.mjs",
24+
"require": "./dist/index.cjs",
25+
"types": "./dist/index.d.ts"
26+
}
27+
},
28+
"files": [
29+
"dist/*.js",
30+
"dist/*.mjs",
31+
"dist/*.cjs",
32+
"dist/*.d.ts"
33+
],
34+
"keywords": [
35+
"vue-termui",
36+
"code",
37+
"syntax",
38+
"component",
39+
"syntax-highlight",
40+
"vue"
41+
],
42+
"author": "webfansplz",
43+
"license": "MIT",
44+
"bugs": {
45+
"url": "https://github.com/vue-terminal/syntax-highlight/issues"
46+
},
47+
"homepage": "https://github.com/vue-terminal/syntax-highlight#readme",
48+
"peerDependencies": {
49+
"vue-termui": "^0.0.17",
50+
"@vue/runtime-core": "^3.2.41"
51+
},
52+
"devDependencies": {
53+
"@types/node": "^18.11.9",
54+
"@vue/runtime-core": "^3.2.41",
55+
"prettier": "^2.8.0",
56+
"tsup": "^6.5.0",
57+
"typescript": "^4.9.3",
58+
"vue": "^3.2.41",
59+
"vue-termui": "0.0.17"
60+
},
61+
"dependencies": {
62+
"cli-highlight": "^2.1.11"
63+
}
64+
}

‎playground/auto-imports.d.ts‎

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
// Generated by 'unplugin-auto-import'
2+
export {}
3+
declare global {
4+
const EffectScope: typeof import('vue-termui')['EffectScope']
5+
const MouseEventType: typeof import('vue-termui')['MouseEventType']
6+
const computed: typeof import('vue-termui')['computed']
7+
const createApp: typeof import('vue-termui')['createApp']
8+
const customRef: typeof import('vue-termui')['customRef']
9+
const defineAsyncComponent: typeof import('vue-termui')['defineAsyncComponent']
10+
const defineComponent: typeof import('vue-termui')['defineComponent']
11+
const effectScope: typeof import('vue-termui')['effectScope']
12+
const getCurrentInstance: typeof import('vue-termui')['getCurrentInstance']
13+
const getCurrentScope: typeof import('vue-termui')['getCurrentScope']
14+
const h: typeof import('vue-termui')['h']
15+
const inject: typeof import('vue-termui')['inject']
16+
const inputDataToString: typeof import('vue-termui')['inputDataToString']
17+
const isInputDataEvent: typeof import('vue-termui')['isInputDataEvent']
18+
const isKeyDataEvent: typeof import('vue-termui')['isKeyDataEvent']
19+
const isMouseDataEvent: typeof import('vue-termui')['isMouseDataEvent']
20+
const isReadonly: typeof import('vue-termui')['isReadonly']
21+
const isRef: typeof import('vue-termui')['isRef']
22+
const markRaw: typeof import('vue-termui')['markRaw']
23+
const nextTick: typeof import('vue-termui')['nextTick']
24+
const onActivated: typeof import('vue-termui')['onActivated']
25+
const onBeforeMount: typeof import('vue-termui')['onBeforeMount']
26+
const onBeforeUnmount: typeof import('vue-termui')['onBeforeUnmount']
27+
const onBeforeUpdate: typeof import('vue-termui')['onBeforeUpdate']
28+
const onDeactivated: typeof import('vue-termui')['onDeactivated']
29+
const onErrorCaptured: typeof import('vue-termui')['onErrorCaptured']
30+
const onInputData: typeof import('vue-termui')['onInputData']
31+
const onKeyData: typeof import('vue-termui')['onKeyData']
32+
const onMounted: typeof import('vue-termui')['onMounted']
33+
const onMouseData: typeof import('vue-termui')['onMouseData']
34+
const onRenderTracked: typeof import('vue-termui')['onRenderTracked']
35+
const onRenderTriggered: typeof import('vue-termui')['onRenderTriggered']
36+
const onScopeDispose: typeof import('vue-termui')['onScopeDispose']
37+
const onServerPrefetch: typeof import('vue-termui')['onServerPrefetch']
38+
const onUnmounted: typeof import('vue-termui')['onUnmounted']
39+
const onUpdated: typeof import('vue-termui')['onUpdated']
40+
const provide: typeof import('vue-termui')['provide']
41+
const reactive: typeof import('vue-termui')['reactive']
42+
const readonly: typeof import('vue-termui')['readonly']
43+
const ref: typeof import('vue-termui')['ref']
44+
const resolveComponent: typeof import('vue-termui')['resolveComponent']
45+
const shallowReactive: typeof import('vue-termui')['shallowReactive']
46+
const shallowReadonly: typeof import('vue-termui')['shallowReadonly']
47+
const shallowRef: typeof import('vue-termui')['shallowRef']
48+
const toRaw: typeof import('vue-termui')['toRaw']
49+
const toRef: typeof import('vue-termui')['toRef']
50+
const toRefs: typeof import('vue-termui')['toRefs']
51+
const triggerRef: typeof import('vue-termui')['triggerRef']
52+
const unref: typeof import('vue-termui')['unref']
53+
const useAttrs: typeof import('vue-termui')['useAttrs']
54+
const useInterval: typeof import('vue-termui')['useInterval']
55+
const useLog: typeof import('vue-termui')['useLog']
56+
const useRootNode: typeof import('vue-termui')['useRootNode']
57+
const useSlots: typeof import('vue-termui')['useSlots']
58+
const useTimeout: typeof import('vue-termui')['useTimeout']
59+
const watch: typeof import('vue-termui')['watch']
60+
const watchEffect: typeof import('vue-termui')['watchEffect']
61+
}

‎playground/components.d.ts‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
// generated by unplugin-vue-components
2+
// We suggest you to commit this file into source control
3+
// Read more: https://github.com/vuejs/core/pull/3399
4+
import '@vue/runtime-core'
5+
6+
export {}
7+
8+
declare module '@vue/runtime-core' {
9+
export interface GlobalComponents {
10+
Box: typeof import('vue-termui')['TuiBox']
11+
}
12+
}

‎playground/package.json‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
{
2+
"name": "playground",
3+
"private": true,
4+
"scripts": {
5+
"dev": "vtui dev",
6+
"build": "vtui build"
7+
},
8+
"devDependencies": {
9+
"@vitejs/plugin-vue": "^3.2.0",
10+
"@vue-termui/cli": "*",
11+
"@vue/compiler-sfc": "^3.2.41",
12+
"unplugin-auto-import": "^0.11.4",
13+
"unplugin-vue-components": "^0.22.9",
14+
"vite": "^3.2.2",
15+
"vite-plugin-vue-termui": "*",
16+
"@vue-termui/syntax-highlight": "workspace:*"
17+
}
18+
}

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /