{"id":17357028,"url":"https://github.com/moontai0724/userscript-template","last_synced_at":"2026-04-11T06:01:39.246Z","repository":{"id":211601297,"uuid":"729553665","full_name":"moontai0724/userscript-template","owner":"moontai0724","description":"Boilerplate to kickstart creating an userscript with Vue 3!","archived":false,"fork":false,"pushed_at":"2024-03-29T00:51:50.000Z","size":252,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"v2","last_synced_at":"2025-06-26T23:58:39.967Z","etag":null,"topics":["boilerplate","eslint","javascript","out-of-the-box","prettier","scaffold","scaffolding","semantic-commits","semantic-release","starter","starter-template","template","typescript","userscript"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/moontai0724.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-12-09T15:42:12.000Z","updated_at":"2024-03-29T02:36:06.000Z","dependencies_parsed_at":"2023-12-17T10:26:59.800Z","dependency_job_id":"49b65c49-3664-4e35-b3a6-3e5600370ee0","html_url":"https://github.com/moontai0724/userscript-template","commit_stats":null,"previous_names":["moontai0724/userscript-template"],"tags_count":0,"template":true,"template_full_name":null,"purl":"pkg:github/moontai0724/userscript-template","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/moontai0724%2Fuserscript-template","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/moontai0724%2Fuserscript-template/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/moontai0724%2Fuserscript-template/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/moontai0724%2Fuserscript-template/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/moontai0724","download_url":"https://codeload.github.com/moontai0724/userscript-template/tar.gz/refs/heads/v2","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/moontai0724%2Fuserscript-template/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":268723073,"owners_count":24296544,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-04T02:00:09.867Z","response_time":79,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["boilerplate","eslint","javascript","out-of-the-box","prettier","scaffold","scaffolding","semantic-commits","semantic-release","starter","starter-template","template","typescript","userscript"],"created_at":"2024-10-15T18:59:48.661Z","updated_at":"2025-12-30T21:50:49.864Z","avatar_url":"https://github.com/moontai0724.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# UserScript Template\n\nAn out-of-the-box userscript template based on Vue 3, simplifying development\nwith auto-rebuilds on file changes, seamless WebDAV integration for extension\nsyncing, semantic commit-based versioning, and a robust CI/CD pipeline for\nautomated releases.\n\n- [Getting Started](#getting-started)\n  - [1. Use this template to create a new repository](#1-use-this-template-to-create-a-new-repository)\n  - [2. Clone the repository](#2-clone-the-repository)\n  - [3. Install dependencies with pnpm install](#3-install-dependencies-with-pnpm-install)\n  - [4. Adjust script basic informations in package.json](#4-adjust-script-basic-informations-in-packagejson)\n  - [5. Start the dev server with pnpm dev](#5-start-the-dev-server-with-pnpm-dev)\n  - [6. Setup sync for script to your extension](#6-setup-sync-for-script-to-your-extension)\n  - [7. Start developing!](#7-start-developing)\n- [Usage](#usage)\n  - [1. Start the dev server](#1-start-the-dev-server)\n  - [2. Build the script](#2-build-the-script)\n- [Sync with extension](#sync-with-extension)\n  - [Way 1. Use @require to import script](#way-1-use-require-to-import-script)\n  - [Way 2. Sync with fake WebDAV by extension](#way-2-sync-with-fake-webdav-by-extension)\n- [FAQ](#faq)\n  - [If I does not needs display, will the Vue be included into the script?](#If-I-does-not-needs-display-will-the-Vue-be-included-into-the-script)\n\n## Getting Started\n\n### 1. Use this template to create a new repository\n\nClick the [`Use this template \u003e Create a new repository`](https://github.com/new?template_name=userscript-template\u0026template_owner=moontai0724) button to create a new\nrepository based on this template.\n\n### 2. Clone the repository\n\n```bash\ngit clone \u003cYOUR REPOSITORY URL\u003e/userscript-template.git\n```\n\n### 3. Install dependencies with `pnpm install`\n\nThis project uses [pnpm](https://pnpm.io/) as package manager, you can install\nit by running:\n\n```bash\nnpm install -g pnpm\n```\n\nor directly install it:\n\n```bash\ncurl -fsSL https://get.pnpm.io/install.sh | sh -\n```\n\nThen install dependencies by running:\n\n```bash\npnpm install\n```\n\n### 4. Adjust script basic informations in `package.json`\n\nThis template will read informations in `package.json` to generate the script\nheader, so you have to adjust the informations in `package.json` to fit your\nscript.\n\nThe following fields are recommended to be filled first:\n\n| Field         | Required | Description                                                    |\n| ------------- | -------- | -------------------------------------------------------------- |\n| `name`        | Yes      | The `name` of the script.                                      |\n| `description` | Yes      | The `description` of the script.                               |\n| `author.name` | Yes      | The `author` of the script, fill your name there.              |\n| `homepage`    | No       | This will be the `namespace` and the `homepage` of the script. |\n\nThe script will read the `user-script-meta` field in `package.json` as the base\nof the script header, then read above fields as an alternative value if empty.\nIt will take the key as the header field name, and take the value as the header\nfield value. So you can add any field you want to the `user-script-meta` field.\n\nFor more detail, you can see [rollup.config.ts](./rollup.config.ts).\n\nThe version here will be auto updated by semantic commit message when you pushes\ncommits to `main` branch, by supporting of\n[`standard-version`](https://github.com/conventional-changelog/standard-version).\n\nIf you're not familiar with semantic commit message, you can see [Conventional\nCommits](https://www.conventionalcommits.org/) for more detail.\n\n### 5. Start the dev server with `pnpm dev`\n\n```bash\npnpm dev\n```\n\nFor more detail, you can see [1. Start the dev server](#1-start-the-dev-server).\n\n### 6. Setup sync for script to your extension\n\nYou could follows any one step in [Sync with extension](#sync-with-extension).\n\n### 7. Start developing!\n\nAll done! Open `src/index.ts` and start editing.\n\n## Usage\n\n### 1. Start the dev server\n\nTo start a development WebDAV server and auto rebuild the script on file\nchanges, run:\n\n```bash\npnpm dev\n```\n\nThere are some environment variables you can use to customize the dev server:\n\n- `PORT`: The port of fake WebDAV server, default is `9000`.\n- `HOST`: The host of fake WebDAV server, default is `0.0.0.0`.\n- `UUID`: The uuid of the scipt. This will force the script to use this UUID\n  instead of detected or generated one. If not set, it will be a default value\n  \"12345678-1234-1234-123456789012\", and it will be auto updated by matching the\n  title of the script with the `name` got from `package.json` when the extension\n  sync.\n- `DEBUG`: Enable debug mode, default is `false`.\n\nFor example, if you want to change the port to `8080`, you can run:\n\n```bash\nPORT=8080 pnpm dev\n```\n\n### 2. Build the script\n\n```bash\npnpm build\n```\n\nThe built script will be in `dist` folder.\n\n## Sync with extension\n\nThere are two way to setup the sync. To use the auto sync feature, you have to\nstart the dev server first.\n\n```bash\npnpm dev\n```\n\nYou can see [5. Start the dev server with pnpm\ndev](#5-start-the-dev-server-with-pnpm-dev) for more detail.\n\n### Way 1. Use @require to import script\n\n#### Step 1-1. Add a loader script to your extension\n\nThis is the easiest way to sync the script with extension. You can add a loader\nscript to your extension, then use `@require` to import the script.\n\ne.g. Create a new script with the following content:\n\n```js\n// ==UserScript==\n// @name         Import script from url\n// @description  A proxy script to import script from url\n// @version      0.0.1\n// @namespace    localhost\n// @match        *://*/*\n// @require      http://localhost:9000/bundle.user.js\n// @grant        none\n// ==/UserScript==\n```\n\nThen the script will be loaded by this script. You may now browse the website\nand you'll find it works.\n\nIf you're using this way, you might have to check the script header.\n\n#### Step 1-2. Clear the cached script in extension or set the cache time to 0\n\nNote that if you use this way, the external script will be cached by the\nextension. You can either manually clear the cached script in extension or set\nthe external script update time to always.\n\nManual clear the cached script in extension:\n\ne.g. For Tampermonkey, you can go to `Externals \u003e Requires` in script editor and\nclick `Delete` button.\n\nSet the external script update time to always:\n\ne.g. For Tampermonkey, you can go to `Settings \u003e Externals` in extension\nSettings and set `Update Interval` to `Always`.\n\n### Way 2. Sync with fake WebDAV by extension\n\n#### Step 2-1. Install the script to extension\n\nAfter you start the dev server, you can install the script to extension.\n\nThe console output should hint you the link to install the script like this:\n\n```bash\nWebDAV server is listening on http://0.0.0.0:9000\nYou can install current script from: http://0.0.0.0:9000/bundle.user.js\n```\n\nOr if this is the first time you start this dev server, you should be able to\ninstall the script from the link below:\n\nhttp://localhost:9000/bundle.user.js\n\n#### Step 2-2. Setup WebDAV sync in extension\n\nThen you can setup the WebDAV sync in extension.\n\nFor Tampermonkey, you can follow the steps below:\n\n1. Go to `Tampermonkey \u003e Settings \u003e General \u003e Config Mode` and set as\n   `Advanced`.\n2. Fill `URL` in `Userscript Sync` with `http://localhost:8080/`.\n3. Check `Enable Userscript Sync` in `Userscript Sync`.\n4. Click `Save`.\n\nThen you can click the \"Run now\" button to start sync.\n\n## FAQ\n\n### If I does not needs display, will the Vue be included into the script?\n\nNo. The bundler will only include the code you used into the script.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmoontai0724%2Fuserscript-template","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmoontai0724%2Fuserscript-template","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmoontai0724%2Fuserscript-template/lists"}