mirror of
https://github.com/halo-dev/docs.git
synced 2026-01-13 06:03:55 +08:00
Use shiki as code highlighter (#521)
This commit is contained in:
Ryan Wang
@@ -119,7 +119,7 @@ mkdir -p /etc/containers/systemd
|
||||
vim /etc/containers/systemd/halo.container
|
||||
```
|
||||
|
||||
```conf
|
||||
```ini
|
||||
[Unit]
|
||||
Description=The halo container
|
||||
Wants=network-online.target
|
||||
@@ -197,7 +197,7 @@ mkdir -p /etc/containers/systemd
|
||||
vim /etc/containers/systemd/halo.container
|
||||
```
|
||||
|
||||
```conf
|
||||
```ini
|
||||
# /etc/containers/systemd/halo.container
|
||||
[Unit]
|
||||
Description=The halo container
|
||||
|
||||
@@ -119,7 +119,7 @@ mkdir -p /etc/containers/systemd
|
||||
vim /etc/containers/systemd/halo.container
|
||||
```
|
||||
|
||||
```conf
|
||||
```ini
|
||||
[Unit]
|
||||
Description=The halo container
|
||||
Wants=network-online.target
|
||||
@@ -197,7 +197,7 @@ mkdir -p /etc/containers/systemd
|
||||
vim /etc/containers/systemd/halo.container
|
||||
```
|
||||
|
||||
```conf
|
||||
```ini
|
||||
# /etc/containers/systemd/halo.container
|
||||
[Unit]
|
||||
Description=The halo container
|
||||
|
||||
@@ -119,7 +119,7 @@ mkdir -p /etc/containers/systemd
|
||||
vim /etc/containers/systemd/halo.container
|
||||
```
|
||||
|
||||
```conf
|
||||
```ini
|
||||
[Unit]
|
||||
Description=The halo container
|
||||
Wants=network-online.target
|
||||
@@ -197,7 +197,7 @@ mkdir -p /etc/containers/systemd
|
||||
vim /etc/containers/systemd/halo.container
|
||||
```
|
||||
|
||||
```conf
|
||||
```ini
|
||||
# /etc/containers/systemd/halo.container
|
||||
[Unit]
|
||||
Description=The halo container
|
||||
|
||||
@@ -119,7 +119,7 @@ mkdir -p /etc/containers/systemd
|
||||
vim /etc/containers/systemd/halo.container
|
||||
```
|
||||
|
||||
```conf
|
||||
```ini
|
||||
[Unit]
|
||||
Description=The halo container
|
||||
Wants=network-online.target
|
||||
@@ -197,7 +197,7 @@ mkdir -p /etc/containers/systemd
|
||||
vim /etc/containers/systemd/halo.container
|
||||
```
|
||||
|
||||
```conf
|
||||
```ini
|
||||
# /etc/containers/systemd/halo.container
|
||||
[Unit]
|
||||
Description=The halo container
|
||||
|
||||
@@ -145,7 +145,7 @@ my-halo-plugin/
|
||||
|
||||
`api/build.gradle` 配置如下：
|
||||
|
||||
```gradle
|
||||
```groovy
|
||||
plugins {
|
||||
id 'java-library'
|
||||
id 'maven-publish'
|
||||
|
||||
@@ -117,7 +117,7 @@ public class CustomEventPublisher {
|
||||
1. 插件 A 将包含了 `CustomSharedEvent` 这个类的依赖 `plugin-a-api` 发布到 Maven 仓库
|
||||
2. 插件 B 引入 `plugin-a-api` 作为项目依赖并将其作为 `compileOnly`，必须是 `compileOnly` 依赖
|
||||
|
||||
```gradle
|
||||
```groovy
|
||||
dependencies {
|
||||
compileOnly "run.halo.example:plugin-a-api:1.0.0"
|
||||
}
|
||||
|
||||
@@ -123,7 +123,7 @@ mkdir -p /etc/containers/systemd
|
||||
vim /etc/containers/systemd/halo.container
|
||||
```
|
||||
|
||||
```conf
|
||||
```ini
|
||||
[Unit]
|
||||
Description=The halo container
|
||||
Wants=network-online.target
|
||||
@@ -201,7 +201,7 @@ mkdir -p /etc/containers/systemd
|
||||
vim /etc/containers/systemd/halo.container
|
||||
```
|
||||
|
||||
```conf
|
||||
```ini
|
||||
# /etc/containers/systemd/halo.container
|
||||
[Unit]
|
||||
Description=The halo container
|
||||
|
||||
@@ -7,7 +7,7 @@ description: 元数据表单组件
|
||||
|
||||
## 使用示例
|
||||
|
||||
```html
|
||||
```vue
|
||||
<script lang="ts" setup>
|
||||
import { ref } from "vue"
|
||||
|
||||
|
||||
@@ -7,7 +7,7 @@ description: 附件文件类型图标组件
|
||||
|
||||
## 使用示例
|
||||
|
||||
```html
|
||||
```vue
|
||||
<script lang="ts" setup></script>
|
||||
|
||||
<template>
|
||||
|
||||
@@ -11,7 +11,7 @@ description: 附件选择组件
|
||||
|
||||
## 使用示例
|
||||
|
||||
```html
|
||||
```vue
|
||||
<script lang="ts" setup>
|
||||
import { ref } from "vue"
|
||||
|
||||
|
||||
@@ -5,7 +5,7 @@ description: 过滤器清除按钮组件
|
||||
|
||||
## 使用示例
|
||||
|
||||
```html
|
||||
```vue
|
||||
<script lang="ts" setup>
|
||||
function onClear () {
|
||||
console.log("clear")
|
||||
|
||||
@@ -7,7 +7,7 @@ description: 过滤器下拉组件
|
||||
|
||||
## 使用示例
|
||||
|
||||
```html
|
||||
```vue
|
||||
<script lang="ts" setup>
|
||||
import { ref } from "vue"
|
||||
|
||||
|
||||
@@ -7,7 +7,7 @@ description: 权限判断组件
|
||||
|
||||
## 使用方式
|
||||
|
||||
```html
|
||||
```vue
|
||||
<script lang="ts" setup>
|
||||
import { VButton } from "@halo-dev/components"
|
||||
</script>
|
||||
|
||||
@@ -17,7 +17,7 @@ pnpm install @halo-dev/components
|
||||
|
||||
在 Vue 组件中：
|
||||
|
||||
```html
|
||||
```vue
|
||||
<script lang="ts" setup>
|
||||
import { VButton } from "@halo-dev/components";
|
||||
</script>
|
||||
|
||||
@@ -7,7 +7,7 @@ description: 插件详情弹窗组件
|
||||
|
||||
## 使用方式
|
||||
|
||||
```html
|
||||
```vue
|
||||
<script lang="ts" setup>
|
||||
import { ref } from "vue"
|
||||
|
||||
|
||||
@@ -7,7 +7,7 @@ description: 搜索输入框组件
|
||||
|
||||
## 使用方式
|
||||
|
||||
```html
|
||||
```vue
|
||||
<script lang="ts" setup>
|
||||
import { ref } from "vue"
|
||||
|
||||
|
||||
@@ -5,7 +5,7 @@ description: 文件上传组件
|
||||
|
||||
## 使用方式
|
||||
|
||||
```html
|
||||
```vue
|
||||
<script lang="ts" setup>
|
||||
const policyName = ref('my-test-policy')
|
||||
const groupName = ref('my-test-group')
|
||||
|
||||
@@ -7,7 +7,7 @@ description: 代码编辑器组件
|
||||
|
||||
## 使用方式
|
||||
|
||||
```html
|
||||
```vue
|
||||
<script lang="ts" setup>
|
||||
import { ref } from "vue"
|
||||
|
||||
|
||||
@@ -7,7 +7,7 @@ description: 权限指令
|
||||
|
||||
## 使用方式
|
||||
|
||||
```html
|
||||
```vue
|
||||
<script lang="ts" setup>
|
||||
import { VButton } from "@halo-dev/components"
|
||||
</script>
|
||||
|
||||
@@ -7,7 +7,7 @@ description: Tooltip 指令
|
||||
|
||||
## 使用方式
|
||||
|
||||
```html
|
||||
```vue
|
||||
<script lang="ts" setup>
|
||||
import { IconDeleteBin } from "@halo-dev/components"
|
||||
</script>
|
||||
|
||||
@@ -281,7 +281,7 @@ export default definePlugin({
|
||||
|
||||
3. 更新项目根目录的 `build.gradle` 文件
|
||||
|
||||
```gradle
|
||||
```groovy
|
||||
plugins {
|
||||
id 'java'
|
||||
id "io.freefair.lombok" version "8.13"
|
||||
@@ -336,7 +336,7 @@ export default definePlugin({
|
||||
|
||||
4. 在 ui 或者 console 目录新建 `build.gradle` 文件，内容如下：
|
||||
|
||||
```gradle
|
||||
```groovy
|
||||
plugins {
|
||||
id 'base'
|
||||
id "com.github.node-gradle.node" version "7.1.0"
|
||||
|
||||
@@ -241,7 +241,7 @@ export interface TodoList {
|
||||
|
||||
编辑 `ui/src/views/HomeView.vue` 文件，将所有内容替换为如下写法：
|
||||
|
||||
```typescript
|
||||
```vue
|
||||
<script setup lang="ts">
|
||||
import axios from "axios";
|
||||
import type { Todo, TodoList } from "../types";
|
||||
@@ -466,14 +466,16 @@ const handleDelete = (todo: Todo) => {
|
||||
|
||||
需要修改 `ui/src/views/HomeView.vue` 示例如下：
|
||||
|
||||
```diff
|
||||
+ import Logo from "@/assets/logo.svg";
|
||||
```vue
|
||||
// [!code ++]
|
||||
import Logo from "@/assets/logo.svg";
|
||||
// ...
|
||||
<template>
|
||||
<section class="todoapp">
|
||||
<header class="header">
|
||||
<h1>
|
||||
+ <img :src="Logo" alt="logo" style="display: inline; width: 64px" />
|
||||
// [!code ++]
|
||||
<img :src="Logo" alt="logo" style="display: inline; width: 64px" />
|
||||
todos
|
||||
</h1>
|
||||
//...
|
||||
|
||||
@@ -95,7 +95,7 @@ export default definePlugin({
|
||||
});
|
||||
```
|
||||
|
||||
```html title="StickerSelectorProvider.vue"
|
||||
```vue title="StickerSelectorProvider.vue"
|
||||
<script lang="ts" setup>
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
|
||||
@@ -87,7 +87,7 @@ export interface DashboardWidgetDefinition {
|
||||
|
||||
### 小部件组件开发
|
||||
|
||||
```html
|
||||
```vue
|
||||
<template>
|
||||
<WidgetCard v-bind="$attrs" :body-class="['!p-0']">
|
||||
<template #title>
|
||||
@@ -221,7 +221,7 @@ export default definePlugin({
|
||||
|
||||
自定义组件：
|
||||
|
||||
```html
|
||||
```vue
|
||||
<template>
|
||||
<div class="group relative cursor-pointer rounded-lg bg-blue-50 p-4 transition-all hover:bg-blue-100">
|
||||
<div class="flex items-center gap-3">
|
||||
|
||||
@@ -76,7 +76,7 @@ export default definePlugin({
|
||||
});
|
||||
```
|
||||
|
||||
```html title="./components/markdown-editor.vue"
|
||||
```vue title="./components/markdown-editor.vue"
|
||||
<script setup lang="ts">
|
||||
import { marked } from "marked";
|
||||
import { debounce } from "lodash-es";
|
||||
|
||||
@@ -65,7 +65,7 @@ export default definePlugin({
|
||||
});
|
||||
```
|
||||
|
||||
```html title="./views/my-component.vue"
|
||||
```vue title="./views/my-component.vue"
|
||||
<script lang="ts" setup>
|
||||
const plugin = inject<Ref<Plugin | undefined>>("plugin");
|
||||
</script>
|
||||
|
||||
@@ -145,7 +145,7 @@ my-halo-plugin/
|
||||
|
||||
`api/build.gradle` 配置如下：
|
||||
|
||||
```gradle
|
||||
```groovy
|
||||
plugins {
|
||||
id 'java-library'
|
||||
id 'maven-publish'
|
||||
|
||||
@@ -122,7 +122,7 @@ public class CustomEventPublisher {
|
||||
1. 插件 A 将包含了 `CustomSharedEvent` 这个类的依赖 `plugin-a-api` 发布到 Maven 仓库
|
||||
2. 插件 B 引入 `plugin-a-api` 作为项目依赖并将其作为 `compileOnly`，必须是 `compileOnly` 依赖
|
||||
|
||||
```gradle
|
||||
```groovy
|
||||
dependencies {
|
||||
compileOnly "run.halo.example:plugin-a-api:1.0.0"
|
||||
}
|
||||
|
||||
@@ -31,7 +31,7 @@ tar zxvf halo-offline-installer-v2.17.0-amd64.tar.gz
|
||||
:::info
|
||||
安装包目录说明
|
||||
|
||||
```text
|
||||
```bash
|
||||
[root@localhost halo-offline-installer-v2.17.0-amd64]# tree
|
||||
.
|
||||
├── docker # 离线安装 Docker 使用到的文件
|
||||
@@ -75,7 +75,7 @@ cd halo-offline-installer-v2.17.0-amd64
|
||||
:::info
|
||||
假设采用默认安装位置 /opt/halo 完成安装，安装目录的文件结构如下：
|
||||
|
||||
```text
|
||||
```bash
|
||||
[root@meter-prototype halo]# tree
|
||||
.
|
||||
├── data # 数据存储目录
|
||||
|
||||
@@ -123,7 +123,7 @@ mkdir -p /etc/containers/systemd
|
||||
vim /etc/containers/systemd/halo.container
|
||||
```
|
||||
|
||||
```conf
|
||||
```ini
|
||||
[Unit]
|
||||
Description=The halo container
|
||||
Wants=network-online.target
|
||||
@@ -201,7 +201,7 @@ mkdir -p /etc/containers/systemd
|
||||
vim /etc/containers/systemd/halo.container
|
||||
```
|
||||
|
||||
```conf
|
||||
```ini
|
||||
# /etc/containers/systemd/halo.container
|
||||
[Unit]
|
||||
Description=The halo container
|
||||
|
||||
Reference in New Issue
Block a user