Understanding JavaScript in Obsidian

Help
1

Hi I am just asking the question about how does JavaScript run in obsidian. I am not new to programming; I am CS major, and I just cannot seem to understand how JavaScript runs in Obsidian.

Let me clarify. I am making my own personal life OS Vault I have a handful of plugins installed that I Think will be integral to the vault. Here is the list bellow, As well as a description on how I think they will be utilize in the final product.

Advance Tables : From what I understand improves on obsidian base handling of tables.

Annotator: Working with PDF files.

Auto Note Mover: An Automatic file mover for the vault.

Banners: Ecstatic prepose, it is just nice to look at for major files in your vault like area files.

Commander: A macro creating commanding system for the vault.

Dataview: Allows for querying of your vault files.

Excalidraw: Allow for handwritten looking notes in the vault which can be a preference choice.

Homepage: The landing page of the life os.

Journals: In my opinion one of the best daily note style plugins.

Kanban: An enhancement feature for project files in the life os.

Linter: To maintain the appearance and uniformity of files in the vault.

Meta Bind: Mainly here to link metadata to values in the body of the note, as well as the button feature.

Metadata Menu: Ok I believe you should separate out your template body from you properties, that’s mainly why this plugin is here.

Omnisearch: Allow for an entire search of your vault for any file, from what I understand.

QuickAdd: Another macro creating commander system. Which is better IDK.

Remotely Save: Allow for sync vault across device, from what I understand.

Task : Allows for better mangament of obsidian build in task feature.

Templater: An overall enhancement to obsidian templating feature.

Ok so why did I just list every plugin in the vault, well because some of them rely on JavaScript files. Now I understand that their is a folder that you can create, or that should automatically be created called scripts, where your JavaScript files should be in your vault. What I am saying I don’t understand is how should a obsidian script file should be written. When working with a base JavaScript file with HTML, and CSS you leave a link in your html file using the Script tag, using the src attribute. This is how I am use to working with JS. Are their any documentation I may have overlooked, any tutorials.

I do apologize if this question has already been answered.

2

So… what exactly is your question?

  • Are you confused about how to install or use a plugin?
  • Are you hoping to write your own plugin?
  • Are you just curious about the inner workings?

It doesn’t seem clear what you need, or what you’re asking about, sorry.

In terms of using plugins, it sounds like you’ve installed a bunch in anticipation of the things you’re imagining you’ll need. It might be better to slowly install them as you find an actual need. As a CS major, I’m sure you’ve heard about premature optimization.

image

5 Likes
3

It sounds like you are looking at Obsidian as if it was a PyCharm clone for Javascript?
Years ago when I wanted to learn Python and Javascript (never got around to learning them at all) I wanted a Hell’s kitchen much like Obsidian is for me now. So I kind of understand what you want to achieve here. But mostly Obsidian is a markdown editor on top of which lots of custom functionality can be built.

All plugins run on Javascript, hooking into the Obsidian base program.
If you need to make extra functionality js files for your own use, you can use Templater or Quickadd (make sure you separate folders holding js files for Templater, Quickadd, or even User Plugins plugin that I like to use).
Look around on the forum for use cases much like yours and Templater and Quickadd GitHub pages where in Discussions developers (repo maintainers) and users showcase their problems and solutions.
Sometimes you may want to use DataViewJs instead of Templater Js scripts (but you can call Templater API and call DV API from Templater).

Tip on choice of other plugins for 2024 going forward:
Annotator has been bettered by the PDF++ plugin and Banners by the Pixel Banner plugin.

2 Likes
4

Curious about the the inner workings.

5

Thank you so much for your actual helpful reply. I hope you have a bless day.

1 Like
6

This from Inline scripts | QuickAdd :

QuickAdd supports the usage of inline scripts in Template choices and Capture choices.

Inline scripts allow you to execute any JavaScript code you want.

You are given the QuickAdd API, just as with user scripts. In inline scripts, it is passed in as this, as can be seen in the example below.

```js quickadd
const input = await this.quickAddApi.inputPrompt("✍");
return `Input given: ${input}`;
```

When you are making an inline script, remember to write js quickadd and not just js when denoting the language - otherwise you’re just inserting a code snippet.

If you want to insert something, simply return it. The return type must be a string

The js code is executed when using template choices or capture choices. However you can run code interactively as well using Execute Code (in notes) or Shell commands (predefined code via hotkey).

1 Like