Obsidian Spreadsheets 插件使用教程

Obsidian Spreadsheets 插件使用教程

obsidian-spreadsheets项目地址:https://gitcode.com/gh_mirrors/ob/obsidian-spreadsheets

1. 项目的目录结构及介绍

Obsidian Spreadsheets 插件的目录结构如下：

obsidian-spreadsheets/
├── assets/
├── editorconfig
├── eslintignore
├── eslintrc
├── gitignore
├── npmrc
├── LICENSE
├── README.md
├── esbuild.config.mjs
├── main.css
├── main.ts
├── manifest.json
├── package.json
├── styles.css
├── tsconfig.json
├── version-bump.mjs
├── versions.json
└── view.tsx

目录结构介绍

• assets/: 存放项目所需的静态资源文件。
• editorconfig, eslintignore, eslintrc, gitignore, npmrc: 配置文件，用于代码格式化和版本控制。
• LICENSE: 项目的许可证文件。
• README.md: 项目说明文档。
• esbuild.config.mjs: esbuild 的配置文件，用于构建项目。
• main.css: 项目的主样式文件。
• main.ts: 项目的主入口文件。
• manifest.json: Obsidian 插件的清单文件，包含插件的元数据。
• package.json: 项目的依赖管理文件。
• styles.css: 项目的样式文件。
• tsconfig.json: TypeScript 的配置文件。
• version-bump.mjs: 用于版本更新的脚本文件。
• versions.json: 版本信息文件。
• view.tsx: 插件的视图组件文件。

2. 项目的启动文件介绍

项目的启动文件是 main.ts。这个文件是 Obsidian 插件的入口点，负责初始化插件并注册必要的功能。

main.ts 文件介绍

// main.ts
import { Plugin } from 'obsidian';
import { SpreadsheetView, SpreadsheetPluginSettings } from './view';

export default class SpreadsheetPlugin extends Plugin {
    settings: SpreadsheetPluginSettings;

    async onload() {
        console.log('Spreadsheet plugin loaded');

        this.addRibbonIcon('table', 'New Spreadsheet', () => {
            this.activateView();
        });

        this.registerView('spreadsheet', (leaf) => new SpreadsheetView(leaf, this.settings));
    }

    async activateView() {
        this.app.workspace.detachLeavesOfType('spreadsheet');

        await this.app.workspace.getRightLeaf(false).setViewState({
            type: 'spreadsheet',
            active: true,
        });

        this.app.workspace.revealLeaf(
            this.app.workspace.getLeavesOfType('spreadsheet')[0]
        );
    }
}

启动文件功能

• 导入必要的模块和组件。
• 定义插件类 SpreadsheetPlugin，继承自 Obsidian 的 Plugin 类。
• 在 onload 方法中，注册插件的图标和视图。
• activateView 方法用于激活插件视图。

3. 项目的配置文件介绍

esbuild.config.mjs

esbuild.config.mjs 是 esbuild 的配置文件，用于构建项目。

// esbuild.config.mjs
import { build } from 'esbuild';

build({
    entryPoints: ['main.ts'],
    bundle: true,
    outfile: 'main.js',
    minify: true,
    sourcemap: true,
}).catch(() => process.exit(1));

tsconfig.json

tsconfig.json 是 TypeScript 的配置文件，用于编译 TypeScript 代码。

{
    "compilerOptions": {
        "target": "es6",
        "module": "commonjs",
        "outDir": "./dist",
        "rootDir": "./src",
        "strict": true,
        "esModuleInterop": true
    },
    "include": ["src"]
}

package.json

package.json 是项目的依赖管理文件，包含项目的元数据和依赖包。

{
    "

obsidian-spreadsheets项目地址:https://gitcode.com/gh_mirrors/ob/obsidian-spreadsheets