Obsidian Shiki 插件启动与配置指南

1. 项目目录结构及介绍

obsidian-shiki-plugin 插件的目录结构如下：

obsidian-shiki-plugin/
├── src/                        # 源代码目录
│   ├── index.ts                # 插件入口文件
│   ├── shiki.ts                # Shiki 语法高亮的处理逻辑
│   └── ...                      # 其他源代码文件
├── assets/                     # 静态资源目录
│   └── ...                      # 静态资源文件
├── themes/                     # 主题样式目录
│   └── ...                      # 主题样式文件
├── package.json                # 项目配置文件
└── ...                         # 其他文件或目录

• src/: 存放插件的源代码。
• assets/: 存放插件的静态资源，如图片、字体等。
• themes/: 存放插件的样式主题文件。
• package.json: 插件的项目配置文件。

2. 项目的启动文件介绍

项目的启动文件是 src/index.ts。以下是启动文件的基本内容：

import { Plugin } from 'obsidian';
import { Shiki } from './shiki';

export default class ShikiPlugin extends Plugin {
  async onload() {
    // 初始化 Shiki 语法高亮
    const shiki = new Shiki(this.app);
    // 注册插件功能
    // ...
  }

  onunload() {
    // 清理插件资源
    // ...
  }
}

在 onload 方法中，插件会初始化并注册相关的功能。在 onunload 方法中，插件会清理它所使用的资源。

3. 项目的配置文件介绍

项目的配置文件是 package.json。以下是配置文件的基本内容：

{
  "name": "obsidian-shiki-plugin",
  "version": "1.0.0",
  "description": "A Shiki syntax highlighter plugin for Obsidian",
  "main": "dist/index.js",
  "scripts": {
    "build": "tsc"
  },
  "dependencies": {
    "obsidian": "^0.12.0",
    "shiki": "^0.5.0"
  },
  "devDependencies": {
    "typescript": "^4.0.0"
  }
}

• name: 插件的名称。
• version: 插件的版本号。
• description: 插件的描述信息。
• main: 指定插件的入口文件。
• scripts: 定义了构建插件的脚本，例如 build 脚本用于编译 TypeScript 代码。
• dependencies: 插件运行所需的依赖。
• devDependencies: 插件开发所需的依赖。