Obsidian 3D Graph 开源项目教程
obsidian-3d-graph👓 A 3D graph for Obsidian!项目地址:https://gitcode.com/gh_mirrors/obs/obsidian-3d-graph
1. 项目的目录结构及介绍
Obsidian 3D Graph 项目的目录结构如下:
obsidian-3d-graph/
├── .github/
│ └── workflows/
├── assets/
│ ├── css/
│ └── js/
├── src/
│ ├── components/
│ ├── models/
│ └── utils/
├── .gitignore
├── LICENSE
├── README.md
├── package.json
└── tsconfig.json
.github/workflows/: 包含 GitHub Actions 的工作流配置文件。assets/: 包含项目所需的静态资源,如 CSS 和 JavaScript 文件。src/: 项目的源代码目录,包含组件、模型和工具函数。.gitignore: 指定 Git 忽略的文件和目录。LICENSE: 项目的开源许可证。README.md: 项目的介绍和使用说明。package.json: 项目的依赖和脚本配置。tsconfig.json: TypeScript 的配置文件。
2. 项目的启动文件介绍
项目的启动文件是 src/index.ts
。该文件负责初始化插件并加载必要的组件和资源。以下是 src/index.ts
的主要内容:
import { Plugin } from 'obsidian';
import { ThreeDGraphView, VIEW_TYPE_THREE_D_GRAPH } from './components/ThreeDGraphView';
export default class ThreeDGraphPlugin extends Plugin {
async onload() {
this.registerView(VIEW_TYPE_THREE_D_GRAPH, (leaf) => new ThreeDGraphView(leaf));
}
}
Plugin: 从 Obsidian API 导入的插件基类。ThreeDGraphView: 自定义的 3D 图视图组件。VIEW_TYPE_THREE_D_GRAPH: 视图类型的常量。ThreeDGraphPlugin: 插件的主类,继承自 Plugin
。onload: 插件加载时调用的方法,注册视图组件。
3. 项目的配置文件介绍
项目的配置文件主要包括 package.json
和 tsconfig.json
。
package.json
package.json
文件定义了项目的依赖、脚本和其他元数据。以下是部分内容:
{
"name": "obsidian-3d-graph",
"version": "1.0.0",
"description": "A 3D graph plugin for Obsidian",
"main": "src/index.ts",
"scripts": {
"build": "tsc",
"dev": "tsc -w"
},
"dependencies": {
"obsidian": "^0.12.0"
},
"devDependencies": {
"typescript": "^4.4.3"
}
}
name: 项目名称。version: 项目版本。description: 项目描述。main: 主入口文件。scripts: 定义了构建和开发脚本。dependencies: 生产环境依赖。devDependencies: 开发环境依赖。
tsconfig.json
tsconfig.json
文件是 TypeScript 的配置文件,定义了编译选项。以下是部分内容:
{
"compilerOptions": {
"target": "ES6",
"module": "CommonJS",
"outDir": "./dist",
"rootDir": "./src",
"strict": true
},
"include": ["src/**/*"]
}
compilerOptions: 编译选项。
target: 编译目标 ES 版本。module: 模块系统。outDir: 输出目录。rootDir: 源代码目录。strict: 启用严格模式。 include: 包含的文件和目录。
obsidian-3d-graph👓 A 3D graph for Obsidian!项目地址:https://gitcode.com/gh_mirrors/obs/obsidian-3d-graph