From 8701ebe98cc22627dfc203e4b2ae30089a9ca1f4 Mon Sep 17 00:00:00 2001 From: Sven Fehler <38158426+Sv443@users.noreply.github.com> Date: Fri, 20 Jun 2025 02:12:20 +0200 Subject: [PATCH 1/2] Update README.md --- README.md | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index af0dce5..6e2033b 100644 --- a/README.md +++ b/README.md @@ -29,12 +29,13 @@ Like this template? Please consider [supporting the development ❤️](https:// 1. Copy `.env.template` to `.env` and change the values inside if needed 2. Search for `#REPLACE:` with your IDE in the entire project and replace all placeholders with your own values 3. Replace the icon at `assets/icon.png` with your own or use [Google's or DuckDuckGo's favicon API](https://codepen.io/djekl/pen/QWKNNjv) in the userscript header (see step 5) -4. Replace the LICENSE.txt file with your own license or remove it if you want your code to be "all rights reserved" (needs to be adjusted in the `license` field of `package.json` too!) +4. Replace the LICENSE.txt file with your own license or remove it if you want your code to be "all rights reserved" + The `license` prop of `package.json` needs to have its [SPDX identifier](https://spdx.org/licenses) adjusted too! (Set it to `"UNLICENSED"` in case of "all rights reserved") 5. Modify the userscript header inside `src/tools/post-build.ts` to whatever you need (see also [GM header reference](https://wiki.greasespot.net/Metadata_Block)) 6. The eslint configuration at `.eslintrc.cjs` is what I use, feel free to remove rules if there are too many or modify them to your preferences -7. Add your own initialization functions to `init()` and `run()` inside the entrypoint file at `src/index.ts` (read the comments for more info) -8. Refer to the sections [project structure](#project-structure), [commands](#commands) and [development](#development-tips-and-notes) next. - If you need a real world example, you can take a look at my [BetterYTM](https://github.com/Sv443/BetterYTM) project, which this template is based on. +7. Refer to the entrypoints `init()` and `run()` inside the file `src/index.ts` for hooking up your own runtime code. Read the comments in said file for more info. +8. Next, refer to the sections [project structure](#project-structure), [commands](#commands) and [development](#development-tips-and-notes). + If you need a real world example, you can take a look at my [BetterYTM](https://github.com/Sv443/BetterYTM) project, which was the origin of this template.
From b6aad8ba43133efd15a13f84b5fb7f556347e4da Mon Sep 17 00:00:00 2001 From: Sven Fehler <38158426+Sv443@users.noreply.github.com> Date: Fri, 20 Jun 2025 02:13:51 +0200 Subject: [PATCH 2/2] Update README.md --- README.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 6e2033b..ab7720b 100644 --- a/README.md +++ b/README.md @@ -69,7 +69,7 @@ Like this template? Please consider [supporting the development ❤️](https:// - **`src/config.ts`** This file contains the DataStore instance that should be used to hold your userscript's configuration object. The DataStore class is very powerful and does a lot of the heavy lifting for you. More instances can also be created to hold different types of data that should be persisted between sessions, cached in-memory for fast, synchronous access and be tagged with a version number, so migration functions can be used to migrate the data to any upcoming format. - For more info, please read the [DataStore documentation.](https://github.com/Sv443-Network/UserUtils#datastore) + For more info, please read the [DataStore documentation.](https://github.com/Sv443-Network/UserUtils/blob/main/docs.md#datastore) - **`src/constants.ts`** Contains some constant variables that are used throughout the userscript's runtime code. This is where arguments are injected into the userscript's runtime code by `tools/post-build.ts` @@ -78,7 +78,7 @@ Like this template? Please consider [supporting the development ❤️](https:// - **`src/observers.ts`** This file should be filled up with many `SelectorObserver` instances. These observe a designated part of the DOM for changes. With the function `addSelectorListener()`, you can then add a listener, given a specific CSS selector, that gets called when the selector has been found in the DOM. - For more info, please read the [SelectorObserver documentation.](https://github.com/Sv443-Network/UserUtils#selectorobserver) + For more info, please read the [SelectorObserver documentation.](https://github.com/Sv443-Network/UserUtils/blob/main/docs.md#selectorobserver) - **`src/types.ts`** Contains all generic TypeScript types that are used in multiple files. - **`src/utils.ts`** @@ -130,7 +130,7 @@ Like this template? Please consider [supporting the development ❤️](https:// - If you're using the [ViolentMonkey extension](https://violentmonkey.github.io/) (which I recommend), after running the command `npm run watch`, you may open the URL shown in the console in your browser and select the `Track local file` option in the installation dialog. This makes it so the userscript automatically updates when the code changes (reloading the website is still necessary). Note: the tab needs to stay open on Firefox or the script won't keep updating itself. -- My library [UserUtils](https://github.com/Sv443-Network/UserUtils) is already included as a dependency. It offers lots of utilities for userscripts like registering listeners for when CSS selectors exist, intercepting events, creating persistent JSON databases, modifying the DOM more easily, various math and array functions and more. You can find the full list of features and their documentation [here.](https://github.com/Sv443-Network/UserUtils#table-of-contents) +- My library [UserUtils](https://github.com/Sv443-Network/UserUtils) is already included as a dependency. It offers lots of utilities for userscripts like registering listeners for when CSS selectors exist, intercepting events, creating persistent JSON databases, modifying the DOM more easily, various math and array functions and more. You can find the full list of features and their documentation [here.](https://github.com/Sv443-Network/UserUtils/blob/main/docs.md#table-of-contents) - Libraries that are required at runtime should be declared inside `require.json`, as long as they are hosted on a CDN and expose a global variable. This way, they will be loaded using the `@require` directive and will be exempt from [minification rules](https://greasyfork.org/en/help/code-rules) on platforms like GreasyFork. You may use a service like [jsDelivr](https://www.jsdelivr.com/) to include any npm library this way.