49 |
50 |
--------------------------------------------------------------------------------
/esbuild.config.mjs:
--------------------------------------------------------------------------------
1 | import esbuild from "esbuild";
2 | import process from "process";
3 | import builtins from "builtin-modules";
4 | import { sassPlugin } from 'esbuild-sass-plugin';
5 |
6 | const banner =
7 | `/*
8 | THIS IS A GENERATED/BUNDLED FILE BY ESBUILD
9 | if you want to view the source, please visit the github repository of this plugin
10 | */
11 | `;
12 |
13 | const prod = (process.argv[2] === "production");
14 |
15 | const context = await esbuild.context({
16 | banner: {
17 | js: banner,
18 | },
19 | entryPoints: ["src/main.ts"],
20 | bundle: true,
21 | external: [
22 | "obsidian",
23 | "electron",
24 | "@codemirror/autocomplete",
25 | "@codemirror/collab",
26 | "@codemirror/commands",
27 | "@codemirror/language",
28 | "@codemirror/lint",
29 | "@codemirror/search",
30 | "@codemirror/state",
31 | "@codemirror/view",
32 | "@lezer/common",
33 | "@lezer/highlight",
34 | "@lezer/lr",
35 | ...builtins],
36 | format: "cjs",
37 | target: "es2018",
38 | logLevel: "info",
39 | sourcemap: prod ? false : "inline",
40 | treeShaking: true,
41 | outfile: "main.js",
42 | plugins: [
43 | sassPlugin({
44 | type: 'style'
45 | }),],
46 | });
47 |
48 | if (prod) {
49 | await context.rebuild();
50 | process.exit(0);
51 | } else {
52 | await context.watch();
53 | }
--------------------------------------------------------------------------------
/gulpfile.js:
--------------------------------------------------------------------------------
1 | const { src, dest } = require('gulp');
2 | const { version } = require('./package.json');
3 |
4 | function defaultTask(cb) {
5 |
6 | src(['./main.js', 'manifest.json', 'styles.css']).pipe(dest(`obsidian-example-plugin-${version}/`));
7 |
8 | cb();
9 | }
10 |
11 | exports.default = defaultTask;
--------------------------------------------------------------------------------
/manifest.json:
--------------------------------------------------------------------------------
1 | {
2 | "id": "example",
3 | "name": "Example Plugin",
4 | "version": "1.0.0",
5 | "minAppVersion": "0.15.0",
6 | "description": "Example Plugin",
7 | "author": "Korbin Zhao",
8 | "authorUrl": "https://korbinzhao.deno.dev/",
9 | "fundingUrl": "https://afdian.net/a/wantian",
10 | "isDesktopOnly": false
11 | }
12 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "obsidian-textfileview-plugin-sample",
3 | "version": "1.0.0",
4 | "description": "A sample of custom Obsidian TextFileView plugin.",
5 | "main": "main.js",
6 | "scripts": {
7 | "start": "yarn run dev",
8 | "dev": "node esbuild.config.mjs",
9 | "build": "tsc -noEmit -skipLibCheck && node esbuild.config.mjs production && gulp",
10 | "gulp": "gulp",
11 | "version": "node version-bump.mjs && git add manifest.json versions.json"
12 | },
13 | "keywords": [],
14 | "author": "",
15 | "devDependencies": {
16 | "@types/node": "16.11.6",
17 | "@types/react": "18.2.14",
18 | "@types/react-dom": "18.2.6",
19 | "@typescript-eslint/eslint-plugin": "5.29.0",
20 | "@typescript-eslint/parser": "5.29.0",
21 | "builtin-modules": "3.3.0",
22 | "esbuild": "0.17.3",
23 | "esbuild-sass-plugin": "2.10.0",
24 | "gulp": "4.0.2",
25 | "obsidian": "latest",
26 | "react": "18.2.0",
27 | "react-dom": "18.2.0",
28 | "sass": "1.63.6",
29 | "typescript": "4.9.4"
30 | },
31 | "dependencies": {
32 | "antd": "5.6.4"
33 | }
34 | }
35 |
--------------------------------------------------------------------------------
/src/components/CustomViewContent/index.scss:
--------------------------------------------------------------------------------
1 | .example-plugin-container {
2 | width: 100%;
3 | height: 100%;
4 | background-color: #fff;
5 | padding: 50px;
6 | color: #333;
7 |
8 | .empty-text {
9 | color: #e2e2e2;
10 | }
11 | }
12 |
--------------------------------------------------------------------------------
/src/components/CustomViewContent/index.tsx:
--------------------------------------------------------------------------------
1 | import React, { useCallback, useEffect, useState } from 'react';
2 | import { Input, Divider } from 'antd';
3 |
4 | import './index.scss';
5 |
6 | const { TextArea } = Input;
7 |
8 | interface Props {
9 | defaultValue: string;
10 | onChange: (value: string | undefined) => void;
11 | }
12 |
13 | const CustomViewContent = ({ defaultValue, onChange }: Props) => {
14 | const [value, setValue] = useState{value || You have inputed nothing.}
34 |