Obsidian Tracker 开源项目教程
1. 项目的目录结构及介绍
Obsidian Tracker 项目的目录结构如下:
obsidian-tracker/
├── .github/
│ └── workflows/
├── docs/
│ ├── examples/
│ └── images/
├── scripts/
├── src/
│ ├── commands/
│ ├── components/
│ ├── lang/
│ ├── lib/
│ ├── styles/
│ └── views/
├── .gitignore
├── .npmrc
├── .prettierrc
├── LICENSE
├── README.md
├── package.json
├── rollup.config.js
└── tsconfig.json
目录结构介绍
- .github/workflows/: 包含 GitHub Actions 的工作流配置文件。
- docs/: 包含项目的文档,如示例和图片。
- scripts/: 包含项目的脚本文件。
- src/: 包含项目的源代码,分为多个子目录:
- commands/: 包含命令相关的代码。
- components/: 包含组件相关的代码。
- lang/: 包含语言相关的代码。
- lib/: 包含库相关的代码。
- styles/: 包含样式相关的代码。
- views/: 包含视图相关的代码。
- .gitignore: Git 忽略文件配置。
- .npmrc: npm 配置文件。
- .prettierrc: Prettier 代码格式化配置文件。
- LICENSE: 项目许可证。
- README.md: 项目说明文档。
- package.json: 项目依赖和脚本配置。
- rollup.config.js: Rollup 打包配置文件。
- tsconfig.json: TypeScript 配置文件。
2. 项目的启动文件介绍
Obsidian Tracker 的启动文件主要是 src/main.ts
。这个文件是项目的入口点,负责初始化插件并注册各种命令和组件。
启动文件内容概述
import { Plugin } from 'obsidian';
import { TrackerPluginSettings, TrackerPluginSettingTab, DEFAULT_SETTINGS } from './settings';
import { registerCommands } from './commands';
import { registerComponents } from './components';
export default class TrackerPlugin extends Plugin {
settings: TrackerPluginSettings;
async onload() {
await this.loadSettings();
registerCommands(this);
registerComponents(this);
this.addSettingTab(new TrackerPluginSettingTab(this.app, this));
}
async loadSettings() {
this.settings = Object.assign({}, DEFAULT_SETTINGS, await this.loadData());
}
async saveSettings() {
await this.saveData(this.settings);
}
}
启动文件功能
- 初始化设置: 加载并初始化插件设置。
- 注册命令: 注册插件提供的各种命令。
- 注册组件: 注册插件使用的各种组件。
- 添加设置选项卡: 添加插件的设置选项卡,方便用户配置插件。
3. 项目的配置文件介绍
Obsidian Tracker 的配置文件主要是 src/settings.ts
。这个文件定义了插件的设置选项和默认配置。
配置文件内容概述
import { App, PluginSettingTab, Setting } from 'obsidian';
export interface TrackerPluginSettings {
exampleSetting: string;
}
export const DEFAULT_SETTINGS: TrackerPluginSettings = {
exampleSetting: '默认值',
};
export class TrackerPluginSettingTab extends PluginSettingTab {
plugin: TrackerPlugin;
constructor(app: App, plugin: TrackerPlugin) {
super(app, plugin);
this.plugin = plugin;
}
display(): void {
const { containerEl } = this;
containerEl.empty();
new Setting(containerEl)
.setName('示例设置')
.setDesc('这是一个示例设置')
.addText(text => text
.setPlaceholder('输入设置值')
.setValue(this.plugin.settings.exampleSetting)
.onChange(async (value) => {
this.plugin.settings.exampleSetting = value;
await this.plugin.