This is the general structure I use when making userscripts, to avoid much of the usual pain involved.
- click "use this template" on the top right to make a new repo
- clone it locally with
git clone pnpm install(if you don't have pnpm already, install it)
For development - run pnpm dev, and copy the userscript given to your favorite userscript manager (I recommend violentmonkey). You may need to accept a permission popup that asks to "Look for and connect to any device on your local network", when on the page you want to use your userscript with.
This example shows an image in the browser's console when visiting https://example.com.
- IMPORTANT: replace the value of
@matchinsrc/banner.tswith the site your userscript is for- recopy the development userscript after changing this!
- replace values like name, author etc in
package.jsonwith your own
To make a release usable by other people, run pnpm build, then check the dist folder.