Option The Firste (online)
Use the new Tampermonkey Editors extension.
As of version 4.19.0, Tampermonkey now allows you to edit your Tampermonkey scripts using VS Code Online. Here's how:
- Install the Tampermonkey Editors extension
- That's it.
After installation, when you click the "Tampermonkey Editors"' icon it will take you to vscode.dev and a "folder" with all installed Tampermonkey scripts should be automatically opened.
A few notes:
a. Your scripts are grouped by Namespace (the // @namespace
line)
b. Some essential extensions from the VS Code desktop app do not work (for e.g., Allessandro Fragnani's essential "Numbered Bookmarks" extension is not available - in fact, no bookmark extension is available as of this writing. No bookmarks. Auuugh!)
Option The Seconde (local)
You can also use your locally-installed VSCode instance to edit your scripts, using this (older) method - however, this might only work on Chromium browsers because of step-the-first:
- Go to your Chrome extension settings and turn on "Allow access to file URLs".
- In the Tampermonkey editor, all you need is a blank script that //requires the js file that contains your actual code.
- You can use VScode to edit that js file.
Extra note: Once you can edit local files, this also opens up the ability to use build systems like webpack or whatever else you fancy. Minify your script. Split it into different files. Transpile from typescript. Go wild.
References:
https://github.com/Tampermonkey/tampermonkey/issues/1654
https://www.tampermonkey.net/changelog.php#v4.19.0