Update sample plugin to use ESBuild.

This commit is contained in:
lishid 2021-10-19 13:34:19 -04:00
parent 5f95bce9e1
commit 3afc9d78ab
6 changed files with 71 additions and 72 deletions

9
.editorconfig Normal file
View File

@ -0,0 +1,9 @@
# top-most EditorConfig file
root = true
[*]
charset = utf-8
insert_final_newline = true
indent_style = tab
indent_size = 4
tab_width = 4

59
main.ts
View File

@ -1,4 +1,4 @@
import { App, Modal, Notice, Plugin, PluginSettingTab, Setting } from 'obsidian'; import { App, Editor, MarkdownView, Modal, Notice, Plugin, PluginSettingTab, Setting } from 'obsidian';
interface MyPluginSettings { interface MyPluginSettings {
mySetting: string; mySetting: string;
@ -12,49 +12,72 @@ export default class MyPlugin extends Plugin {
settings: MyPluginSettings; settings: MyPluginSettings;
async onload() { async onload() {
console.log('loading plugin');
await this.loadSettings(); await this.loadSettings();
this.addRibbonIcon('dice', 'Sample Plugin', () => { // This creates an icon in the left ribbon.
let ribbonIconEl = this.addRibbonIcon('dice', 'Sample Plugin', (evt: MouseEvent) => {
// Called when the user clicks the icon.
new Notice('This is a notice!'); new Notice('This is a notice!');
}); });
// Perform additional things with the ribbon
ribbonIconEl.addClass('my-plugin-ribbon-class');
this.addStatusBarItem().setText('Status Bar Text'); // This adds a status bar item to the bottom of the app. Does not work on mobile apps.
let statusBarItemEl = this.addStatusBarItem();
statusBarItemEl.setText('Status Bar Text');
// This adds a simple command that can be triggered anywhere
this.addCommand({ this.addCommand({
id: 'open-sample-modal', id: 'open-sample-modal-simple',
name: 'Open Sample Modal', name: 'Open sample modal (simple)',
// callback: () => { callback: () => {
// console.log('Simple Callback'); new SampleModal(this.app).open();
// }, }
});
// This adds an editor command that can perform some operation on the current editor instance
this.addCommand({
id: 'sample-editor-command',
name: 'Sample editor command',
editorCallback: (editor: Editor, view: MarkdownView) => {
console.log(editor.getSelection());
editor.replaceSelection('Sample Editor Command');
}
});
// This adds a complex command that can check whether the current state of the app allows execution of the command
this.addCommand({
id: 'open-sample-modal-complex',
name: 'Open sample modal (complex)',
checkCallback: (checking: boolean) => { checkCallback: (checking: boolean) => {
let leaf = this.app.workspace.activeLeaf; // Conditions to check
if (leaf) { let markdownView = this.app.workspace.getActiveViewOfType(MarkdownView);
if (markdownView) {
// If checking is true, we're simply "checking" if the command can be run.
// If checking is false, then we want to actually perform the operation.
if (!checking) { if (!checking) {
new SampleModal(this.app).open(); new SampleModal(this.app).open();
} }
// This command will only show up in Command Palette when the check function returns true
return true; return true;
} }
return false;
} }
}); });
// This adds a settings tab so the user can configure various aspects of the plugin
this.addSettingTab(new SampleSettingTab(this.app, this)); this.addSettingTab(new SampleSettingTab(this.app, this));
this.registerCodeMirror((cm: CodeMirror.Editor) => { // If the plugin hooks up any global DOM events (on parts of the app that doesn't belong to this plugin)
console.log('codemirror', cm); // Using this function will automatically remove the event listener when this plugin is disabled.
});
this.registerDomEvent(document, 'click', (evt: MouseEvent) => { this.registerDomEvent(document, 'click', (evt: MouseEvent) => {
console.log('click', evt); console.log('click', evt);
}); });
// When registering intervals, this function will automatically clear the interval when the plugin is disabled.
this.registerInterval(window.setInterval(() => console.log('setInterval'), 5 * 60 * 1000)); this.registerInterval(window.setInterval(() => console.log('setInterval'), 5 * 60 * 1000));
} }
onunload() { onunload() {
console.log('unloading plugin');
} }
async loadSettings() { async loadSettings() {

View File

@ -2,9 +2,9 @@
"id": "obsidian-sample-plugin", "id": "obsidian-sample-plugin",
"name": "Sample Plugin", "name": "Sample Plugin",
"version": "1.0.1", "version": "1.0.1",
"minAppVersion": "0.9.12", "minAppVersion": "0.12.0",
"description": "This is a sample plugin for Obsidian. This plugin demonstrates some of the capabilities of the Obsidian API.", "description": "This is a sample plugin for Obsidian. This plugin demonstrates some of the capabilities of the Obsidian API.",
"author": "Obsidian", "author": "Obsidian",
"authorUrl": "https://obsidian.md/about", "authorUrl": "https://obsidian.md",
"isDesktopOnly": false "isDesktopOnly": false
} }

View File

@ -1,23 +1,20 @@
{ {
"name": "obsidian-sample-plugin", "name": "obsidian-sample-plugin",
"version": "0.12.0", "version": "0.12.0",
"description": "This is a sample plugin for Obsidian (https://obsidian.md)", "description": "This is a sample plugin for Obsidian (https://obsidian.md)",
"main": "main.js", "main": "main.js",
"scripts": { "scripts": {
"dev": "rollup --config rollup.config.js -w", "dev": "esbuild main.ts --bundle --external:obsidian --outdir=. --target=es2016 --format=cjs --sourcemap=inline --watch",
"build": "rollup --config rollup.config.js --environment BUILD:production" "build": "esbuild main.ts --bundle --external:obsidian --outdir=. --target=es2016 --format=cjs"
}, },
"keywords": [], "keywords": [],
"author": "", "author": "",
"license": "MIT", "license": "MIT",
"devDependencies": { "devDependencies": {
"@rollup/plugin-commonjs": "^18.0.0", "@types/node": "^16.11.1",
"@rollup/plugin-node-resolve": "^11.2.1", "esbuild": "0.13.8",
"@rollup/plugin-typescript": "^8.2.1", "obsidian": "^0.12.17",
"@types/node": "^14.14.37", "tslib": "2.3.1",
"obsidian": "^0.12.0", "typescript": "4.4.4"
"rollup": "^2.32.1", }
"tslib": "^2.2.0",
"typescript": "^4.2.4"
}
} }

View File

@ -1,30 +0,0 @@
import typescript from '@rollup/plugin-typescript';
import {nodeResolve} from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
const isProd = (process.env.BUILD === 'production');
const banner =
`/*
THIS IS A GENERATED/BUNDLED FILE BY ROLLUP
if you want to view the source visit the plugins github repository
*/
`;
export default {
input: 'main.ts',
output: {
dir: '.',
sourcemap: 'inline',
sourcemapExcludeSources: isProd,
format: 'cjs',
exports: 'default',
banner,
},
external: ['obsidian'],
plugins: [
typescript(),
nodeResolve({browser: true}),
commonjs(),
]
};

View File

@ -4,7 +4,7 @@
"inlineSourceMap": true, "inlineSourceMap": true,
"inlineSources": true, "inlineSources": true,
"module": "ESNext", "module": "ESNext",
"target": "es6", "target": "ES6",
"allowJs": true, "allowJs": true,
"noImplicitAny": true, "noImplicitAny": true,
"moduleResolution": "node", "moduleResolution": "node",