- Allow Tampermonkey's access to local file URIs tampermonkey/faq
- Install deps with
npm i
ornpm ci
. npm run dev
to start your development. Now you will see 2 files in/dist/
dist/index.dev.proxy.user.js
: You should install this userscript in your browser. It's a simple loader that loadsdist/index.dev.user.js
on matched websites.dist/index.dev.user.js
: This is the development build withsource-map
. It will be automatically loaded bydist/index.dev.user.js
. Don't add it to your userscript manager.
Livereload is default enabled, use this Chrome extension
Everytime you change your metadata config,
you'll have to restart the webpack server and install the newly generated dist/index.dev.user.js
UserScript in your browser again.
There are two ways to using a package on npm.
Like the original UserScript way, you will need to add them to your user script metadata's require section and exclude them in config/webpack.config.base.cjs
Just install packages with npm and import them in your code, webpack will take care them.
npm run build
dist/index.prod.user.js
is the final script.
dist/index.prod.meta.js
can be used to compare the script version without having to download the whole script.
Github Actions will deploy the production userscript to this Gist on each new version tag.