A UserScript helps import teams to a Falinks Teambuilder room. It will be activated on both Pokemon Showdown and PokePaste.
Essentially, it creates a "Open in a Falinks Teambuilder room" button on the page. It makes loading the team into a collaborative teambuilder easier.
- Pokemon Showdown: On a team list view in Showdown Teambuilder, the button shows at the bottom, next to "Upload to PokePaste" button.
- PokePaste: the button shows at the bottom of the right side.
Once you have finished building your team, you can add it to your Pokémon Showdown by clicking the "Load in Showdown" button in the room. It will automatically add your new team in your Showdown teambuilder storage after your confirmation.
Derived from the template webpack-userscript-template.
- 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.user.js
: You should install this userscript in your browser. It's a simple loader that loaddist/index.debug.user.js
on matched web page.dist/index.debug.user.js
: This is the development build witheval-source-map
. It will be automatically loaded bydist/index.dev.user.js
via@require file://.../dist/index.debug.user.js
metadata, Don't add it to your userscript manager.
- edit src/index.ts, you can even import css or less files. You can use scss if you like.
- go wo https://www.example.com/ and open console, you'll see it's working.
livereload is default enabled, use this Chrome extension
Everytime you change your metadata config,
you'll have to restart webpack server and install newly generated dist/index.dev.user.js
UserScript in your browser again.
you can call GM.xmlHttpRequest
,
if you prefer fetch
API, you can use https://github.com/Trim21/gm-fetch
If you are using axios, you can use https://github.com/Trim21/axios-userscript-adapter
(these libraries are both included already)
use typescript as normal, see example
There are two ways to using a package on npm.
like 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 a package and import it in your js file. webpack will pack them with in your final production js file.
npm run build
dist/index.prod.user.js
is the final script. you can manually copy it to greaskfork for deploy.
There is a limitation in greasyfork, your code must not be obfuscated or minified.
If you don't need to deploy your script to greaskfork, enable minify as you like.
github actions will deploy production userscript to gh-pages branch.
You can auto use greasyfork's auto update function.