Skip to content

Commit e6b81e0

Browse files
committed
feat: support prop filename
1 parent 755652b commit e6b81e0

12 files changed

Lines changed: 303 additions & 178 deletions

File tree

README-zh.md

Lines changed: 21 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -107,12 +107,13 @@ Vue.use(CodeDiff);
107107
| language | 代码语言,如`typescript`,默认纯文本。 [查看全部支持语言](https://github.com/highlightjs/highlight.js/blob/main/SUPPORTED_LANGUAGES.md) | string | - | plaintext |
108108
| oldString | 旧的字符串 | string | - | - |
109109
| newString | 新的字符串 | string | - | - |
110-
| context | 不同地方上下间隔多少行不隐藏 | number | - | - |
110+
| context | 不同地方上下间隔多少行不隐藏 | number | - | 10 |
111111
| outputFormat | 展示方式 | string | line-by-line,side-by-side | line-by-line |
112112
| diffStyle | 差异风格, 单词级差异或字母级差异 | string | word, char | word |
113113
| trim | 移除字符串前后空白字符 | boolean | - | false |
114114
| noDiffLineFeed | 不 diff windows 换行符(CRLF)与 linux 换行符(LF) | boolean | - | false |
115115
| maxHeight | 组件最大高度,例如 300px | number | - | undefined |
116+
| filename | 文件名 | string | - | undefined |
116117

117118
## 拓展高亮语言
118119

@@ -151,9 +152,10 @@ v-code-diff 的 1.x 版本相较于 0.x 版本,具有打包体积减小、性
151152
* 1.x 版本中,不再会自动识别语言并高亮,您需要手动指定语言类型,如 `language="python"`,若不指定则默认为纯文本`plaintext`
152153
,不会进行高亮。
153154
* 1.x 版本中,由于渲染和高亮是同时进行,因此移除了组件事件
154-
* 1.x 版本中,移除了以下组件属性(Prop)
155-
* highlight
156-
* drawFileList
155+
* 1.x 版本中,以下组件属性(Prop)有变动
156+
* highlight - 移除
157+
* drawFileList - 移除
158+
* fileName - 更名为 filename
157159

158160
以下是两个版本具体的差异点,您可以参照阅读完成迁移。
159161

@@ -168,21 +170,21 @@ v-code-diff 的 1.x 版本相较于 0.x 版本,具有打包体积减小、性
168170

169171
### 组件属性对比
170172

171-
| 参数 | 含义 | 变更情况 |
172-
|------------------------|-------------------|----------------|
173-
| highlight | 控制是否高亮代码 | 1.x 版本移除 |
174-
| language | 代码语言 ||
175-
| old-string | 旧的字符串 ||
176-
| new-string | 新的字符串 ||
177-
| context | 不同地方上下间隔多少行不隐藏 ||
178-
| output-format | 展示方式 ||
179-
| diff-style | 差异风格, 单词级差异或字母级差异 ||
180-
| drawFileList | 展示对比文件列表 | 1.x 版本移除 |
181-
| renderNothingWhenEmpty | 当无对比时不渲染 | 1.x 版本移除 |
182-
| fileName | 文件名 | 待定,暂不开发 |
183-
| isShowNoChange | 当无对比时展示源代码 | 1.x 变为默认情况,故移除 |
184-
| trim | 移除字符串前后空白字符 ||
185-
| noDiffLineFeed | 忽视不同系统换行符差异 ||
173+
| 参数 | 含义 | 变更情况 |
174+
|------------------------|-------------------|--------------------|
175+
| highlight | 控制是否高亮代码 | 1.x 版本移除 |
176+
| language | 代码语言 | |
177+
| old-string | 旧的字符串 | |
178+
| new-string | 新的字符串 | |
179+
| context | 不同地方上下间隔多少行不隐藏 | |
180+
| output-format | 展示方式 | |
181+
| diff-style | 差异风格, 单词级差异或字母级差异 | |
182+
| drawFileList | 展示对比文件列表 | 1.x 版本移除 |
183+
| renderNothingWhenEmpty | 当无对比时不渲染 | 1.x 版本移除 |
184+
| fileName | 文件名 | 1.x 版本更名为 filename |
185+
| isShowNoChange | 当无对比时展示源代码 | 1.x 变为默认情况,故移除 |
186+
| trim | 移除字符串前后空白字符 | |
187+
| noDiffLineFeed | 忽视不同系统换行符差异 | |
186188

187189
## 变更记录
188190

README.md

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -107,12 +107,13 @@ Not recommended, but the relevant capabilities are retained to facilitate migrat
107107
| language | Code language, such as typescript, defaults to plain text. [View all supported languages](https://github.com/highlightjs/highlight.js/blob/main/SUPPORTED_LANGUAGES.md) | string | - | plaintext |
108108
| oldString | Old string | string | - | - |
109109
| newString | New string | string | - | - |
110-
| context | The number of lines to separate different parts so that they are not hidden | number | - | - |
110+
| context | The number of lines to separate different parts so that they are not hidden | number | - | 10 |
111111
| outputFormat | Display mode | string | line-by-line,side-by-side | line-by-line |
112112
| diffStyle | Difference style, word-level differences or letter-level differences | string | word, char | word |
113113
| trim | Remove blank characters at the beginning and end of the string | boolean | - | false |
114114
| noDiffLineFeed | Don't diff Windows line feed (CRLF) and Linux line feed (LF) | boolean | - | false |
115115
| maxHeight | Maximum height of component, for example: 300px | string | - | undefined |
116+
| filename | Filename | string | - | undefined |
116117

117118
## Extend languages
118119

@@ -156,9 +157,10 @@ Key points:
156157
* In the 1.x version, due to the fact that rendering and highlighting are performed at the same time, the component
157158
events
158159
have been removed.
159-
* In the 1.x version, the following component properties (Prop) have been removed:
160-
* highlight
161-
* drawFileList
160+
* In the 1.x version, the following component properties (Prop) have been changed:
161+
* highlight - removed
162+
* drawFileList - removed
163+
* fileName - rename to "filename"
162164

163165
Below is a detailed comparison of the two versions, you can refer to it to complete the migration.
164166

demo/App.vue

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,13 @@ import { newShortText } from './text/new-short-text'
55
import { oldShortText } from './text/old-short-text'
66
77
const formState = reactive({
8-
language: 'json',
8+
language: 'javascript',
99
diffStyle: 'word',
1010
outputFormat: 'side-by-side',
1111
context: 10,
1212
trim: false,
1313
noDiffLineFeed: false,
14+
filename: 'package.json',
1415
})
1516
1617
const oldString = ref(oldShortText.value)
@@ -50,9 +51,9 @@ watch(newString, () => localStorage.setItem('newString', newString.value))
5051
layout="inline"
5152
:model="formState"
5253
>
53-
<!-- <a-form-item label="文件名(filename)" -->
54-
<!-- <a-input v-model:value="formState.filename" placeholder="请输入文件名" /> -->
55-
<!-- </a-form-item> -->
54+
<a-form-item label="文件名(filename)">
55+
<a-input v-model:value="formState.filename" placeholder="请输入文件名" />
56+
</a-form-item>
5657
<a-form-item label="语言(langauge)">
5758
<a-select v-model:value="formState.language" style="width: 120px;" disabled>
5859
<a-select-option value="json">
@@ -112,6 +113,7 @@ watch(newString, () => localStorage.setItem('newString', newString.value))
112113
:context="formState.context"
113114
:trim="formState.trim"
114115
:no-diff-line-feed="formState.noDiffLineFeed"
116+
:filename="formState.filename"
115117
/>
116118
</template>
117119

demo/package.json

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@
77
"gh-pages": "npm run build && gh-pages -d ./dist"
88
},
99
"dependencies": {
10-
"vue": "^3.2.45",
1110
"ant-design-vue": "^3.2.15",
1211
"gh-pages": "^5.0.0"
1312
},

demo/vite.config.ts

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,14 @@
11
import { defineConfig } from 'vite'
2-
import vue from '@vitejs/plugin-vue'
2+
import Vue from '@vitejs/plugin-vue'
33
import Components from 'unplugin-vue-components/vite'
44
import { AntDesignVueResolver } from 'unplugin-vue-components/resolvers'
55

66
export default defineConfig({
7-
plugins: [vue(), Components({ resolvers: [AntDesignVueResolver()], dts: false })],
7+
plugins: [Vue(), Components({ resolvers: [AntDesignVueResolver()], dts: false })],
8+
resolve: {
9+
alias: {
10+
'vue': 'vue3',
11+
'vue-demi': '../node_modules/vue-demi/lib/v3/index.mjs',
12+
},
13+
},
814
})

0 commit comments

Comments
 (0)