pjeby / hot-reload Goto Github PK

Automatically reload Obsidian plugins in development when their files are changed

License: ISC License

JavaScript 100.00%

obsidian-md obsidian-plugin hot-module-replacement

hot-reload's Introduction

Hot-Reload Plugin for Obsidian.md Plugins

If you develop plugins for Obsidian.md, you may be familiar with the frequent need to either restart/reload Obsidian, or else go into its plugin settings to disable and re-enable the plugin you're working on.

Well, you don't need to do that any more. Just install this plugin, and let it do all the work. When enabled, this plugin automatically watches for changes to the main.js or styles.css of any plugin whose directory includes a .git subdirectory or a file called .hotreload, and then automatically disables and re-enables that plugin once changes have stopped for about three-quarters of a second. A notice will appear briefly in Obsidian when the reload occurs. (The verbose logs in the developer tools will also reflect this.)

The plugin also watches for changes to manifest.json files, and the addition or removal of .git or .hotreload, and updates its watch lists accordingly. So there's no configuration needed to add or remove plugins from the hot reload list: just put your new plugin(s) under revision control or create a .hotreload file in them.

(And, since Obsidian only includes main.js and styles.css in plugin downloads, you don't have to worry about .hotreload escaping into the wild: when other people download your plugin from the Obsidian marketplace, it won't be hot-reloaded, even if they're using the hot-reload plugin, too.)

Note, however, that if you have this plugin enabled, then it can enable plugins that are not currently enabled in the settings, so long as you've checked them out using git or have added a .hotreload file. (For development, this is actually a good thing, because when you make a change that breaks the plugin load process, all you need to do is save your file(s) again, and hotreload will try to enable it again, saving you from having to reload or go back to the settings again.)

Finally, note that while this plugin takes care of the grunt work of reloading your plugin, please keep in mind that it's your plugin's job to properly clean up after itself. If you're not making good use of onunload() and the various registerX() methods to ensure all your changes unload properly, then you may leave Obsidian in an unstable state, forcing you to restart or reload to restore the app to a working state.

Installation

This is an Obsidian plugin like any other, and must be cloned or unzipped into your vault's .obsidian/plugins/ directory (or similar one if you've overridden the .obsidian directory name in the Obsidian settings), then enabled in the Obsidian configuration. It's not registered as a standard community plugin for downloading or updating within Obsidian, because it's intended for developer use only, and because it can enable other plugins.

Mobile Plugin Development

This plugin is strictly for the desktop and does not run on Obsidian mobile. If you want to get hot-reloading there, you have two main options, depending on what synchronization tool/service you're using:

Obsidian Sync service: Enable the "Sync > Vault configuration sync, Installed community plugins" setting for Obsidian to automatically restart modified plugins after sync (Thanks to @ChasKane for providing this tip)
Other Sync tools: the Hot Reload Mobile plugin works with any synchronization mechanism that updates notes, by writing to a note on desktop to trigger the reload on mobile after the note syncs.

hot-reload's People

Contributors

Stargazers

Watchers

hot-reload's Issues

The plugin doesn’t seem to work

I downloaded hot-reload and sample-plugin, and then modified the code of main.ts of sample-plugin. I still need to manually open and close sample-plugin for the changes to take effect. Do I need to configure anything else?

Add setting to disable reload Notice

Hello,

It would be nice if this plugin exposed a setting which allowed you to disable the Notice that is sent on reload. This notice covers the right drawer and makes development on plugins with ItemView a bit painful.

Plugin fails to unload every second reload (when main is updated)

Hi there,
This issues just started happening. Can't be sure if I've caused it. But maybe you can help.

Plugin failure: tag-buddy TypeError: Cannot read properties of undefined (reading 'e')
at app.js:1:1148287
at e.unload (app.js:1:1147899)
at e. (app.js:1:2027133)
at app.js:1:237258
at Object.next (app.js:1:237363)
at app.js:1:236279
at new Promise ()
at v (app.js:1:236024)
at e.unloadPlugin (app.js:1:2027038)
at e. (app.js:1:2030070)
at app.js:1:237258
at Object.next (app.js:1:237363)
at app.js:1:236279
at new Promise ()
at v (app.js:1:236024)
at e.disablePlugin (app.js:1:2029944)
at HotReload.reload (plugin:hot-reload:95:23)
at eval (plugin:hot-reload:84:79)

Add setting to perform a full reload of the obsidian window on refresh

I have been using the hot reload plugin for some time now during development for my team's Obsidian plugin.

I have started to notice some issues, especially as the project grows primarily due to stale JS code that continues to run after the plugin gets reloaded. This seems to be worsened as it seems that the unload function within the plugin is not ran during the hot reloading process, meaning my websocket connections will grow n times with the number of reloads, and so will my dom elements that aren't cleared as a part of the loading process.

There may be something I could do better on my side, but a really simple fix for me is running window.location.reload(), performing a full reload of obsidian instead of reloading the singular plugin.

It may be worthwhile to add a setting to do this for the larger plugins in the space that may be able to benefit from this, I'll even do it myself depending on what the maintainers of this repo think!

Add hotkeys for reloading plugins manually?

Hi,

this idea just came to mind. I often need to reload my plugin even if I haven't changed its source code. For example, I might change my plugin's settings file's content manually (outside Obsidian) and then would like to reload the plugin to test that the plugin loads the updated settings file without errors.

Currently I'm using Obsidian's Reload app without saving command, but that's a bit of an overkill when only needing to reload a plugin, as often any current file views go to different scroll positions etc. It would be more convenient to have a hotkey for reloading a specific community plugin.

Thank you for considering this! 🙂

Not detecting change when copying files into vault

I am using iCloud to sync my vault across devices and I was finding that certain files in the node_modules directory were not able to sync so I needed an alternative to working directly on my plugin inside the vault.

What I do now is, every time I build the repo (which lives externally to the vault), I then have a script copy over the main.js, manifest.json, and styles.css to the [VAULT]/.obsidian/plugins/[PLUGIN NAME] directory.

My script does update the filesand if I stop and restart Obsidian I get the new version but for some reason the change is not detected. I tried adding a touch "${filename}" but this didn't change the outcome.

License

Hey @pjeby thanks for such an amazing plugin. I am using for my obsidian-svelte-plugin template and obsidian-dataview also uses it. It just crossed my mind that hot-reload doesn't have a license yet, do you mind adding one to prevent a misunderstandings in the future?

The plugin doesn't work if the default `.obsidian` folder changed in settings

It seems that .obsidian folder is hard-coded in this plugin

Does this only work for one plugin?

I have two sample plugins in a plugin directory and it seems to only hotreload the first one?

Browser Window fail on reload?

I'm probably doing something wrong.

I have a modal in my window. Launched from my settings. When the plugin reloads after changes, and I try to launch the modal again I get:

remote.js:273 Uncaught Error: Could not call remote method 'show'. Check that the method signature is correct. Underlying error: TypeError: Object has been destroyedUnderlying stack: TypeError: Object has been destroyed
    at [my local folder]\Obsidian\resources\app.asar\node_modules\@electron\remote\dist\src\main\server.js:465:71
    at IpcMainImpl.<anonymous> ([my local folder]\Obsidian\resources\app.asar\node_modules\@electron\remote\dist\src\main\server.js:323:27)
    at IpcMainImpl.emit (node:events:513:28)
    at WebContents.<anonymous> (node:electron/js2c/browser_init:2:89772)
    at WebContents.emit (node:events:513:28)

    at [my local folder]\Obsidian\resources\app.asar\node_modules\@electron\remote\dist\src\main\server.js:468:25
    at IpcMainImpl.<anonymous> ([my local folder]\Obsidian\resources\app.asar\node_modules\@electron\remote\dist\src\main\server.js:323:27)
    at IpcMainImpl.emit (node:events:513:28)
    at WebContents.<anonymous> (node:electron/js2c/browser_init:2:89772)
    at WebContents.emit (node:events:513:28)

I instantiate with:
const window = new BrowserWindow({ show: false,{ show: false,[...]});

In the on close method I end with:
window.destroy();

What should I be doing to reload correctly? (Incidentally: if I force a reload with Ctrl-R in the console window, it works fine.)

FIX | `require('fs')` (so, this plugin) breaks on latest Node version

After upgrading to latest node version (v20.16.0), I started seeing the below error in the console and noticed that hot reload wasn't working anymore (changes to other plugins' main.js files didn't work). I'm not sure what change in node made this happen, but adding window. before require("fs") fixed it for me. Leaving the this and the reference in case this is helpful for anyone else. As I'm unsure if this is a shared issue, I'll abstain from making a fork and PR for now.

Error: [hot-reload] Attempting to load NodeJS package: "fs"

About plugins are not functioning properly

Add .hotreload file in .obsidian/plugins directory, instead of .obsidian/plugins/your-plugin