create-tampermonkey-typescript 1.1.0 → 1.2.1

package/LICENSE

@@ -1,7 +1,7 @@
-Copyright (c) 2026 neth392
-
-Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+Copyright (c) 2026 neth392
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/README.md

@@ -1,62 +1,69 @@
-# create-tampermonkey-typescript
-
-> A CLI scaffolding tool for creating minimal TamperMonkey userscript projects written in TypeScript.
-
-Write your userscripts in TypeScript, organize code across multiple files, and let the toolchain handle the rest 
-— bundling, CSS injection, and userscript header generation are all taken care of. The result is a single `.user.js` 
-file ready to install in TamperMonkey.
-
----
-
-## Features
-
-📦 **TypeScript with multi-file support** — Structure your project however you like. All source files are bundled into 
-a single IIFE-format JavaScript file via [Vite](https://vite.dev/), fully compatible with TamperMonkey.
-
-🏷️ **Automatic userscript header** — The `// ==UserScript==` block is generated from a template (`userscript.txt`) and
-prepended to every build. Metadata fields such as name, version, and description are pulled directly from `package.json`, 
-keeping a single source of truth.
-
-🎨 **CSS injection** — Import `.css` files from TypeScript as you normally would. At build time, styles are extracted 
-and bundled into the output script, then injected into the page at runtime — no manual DOM manipulation required.
-
-⚛️ **Optional React support** — Scaffold the project with React pre-configured, including type declarations for 
-`unsafeWindow.React` and `unsafeWindow.ReactDOM`, and utility functions for accessing them at runtime.
-
-🚀 **GitHub Actions workflows** — Optionally include CI/CD workflows that automatically create Git tags when 
-`package.json` version changes, and publish GitHub Releases with the built script attached.
-
-🔧 **Package manager agnostic** — Generated projects are standard Node.js projects. Use npm, yarn, or pnpm — 
-whichever you prefer.
-
----
-
-## Quick Start
-
-### npm
-
-```bash
-npx create-tampermonkey-typescript
-```
-
-### yarn
-
-```bash
-yarn create tampermonkey-typescript
-```
-
-### pnpm
-
-```bash
-pnpm create tampermonkey-typescript
-```
-
-The CLI will walk you through the project configuration — name, version, description, author — and let you 
-select optional features (React, Git). The output is your new project folder containing its own `README.md`
-to get you started. You can preview that file here: [Generated Project README](templates/base/README.md)
-
----
-
-## License
-
+# create-tampermonkey-typescript
+
+> A CLI scaffolding tool for creating minimal TamperMonkey userscript projects written in TypeScript.
+
+Write your userscripts in TypeScript, organize code across multiple files, and let the toolchain handle the rest 
+— bundling, CSS injection, and userscript header generation are all taken care of. The result is a single `.user.js` 
+file ready to install in TamperMonkey.
+
+---
+
+## Features
+
+📦 **TypeScript with multi-file support** — Structure your project however you like. All source files are bundled into 
+a single IIFE-format JavaScript file via [Vite](https://vite.dev/), fully compatible with TamperMonkey.
+
+🏷️ **Automatic userscript header** — The `// ==UserScript==` block is generated from a template (`userscript.txt`) and
+prepended to every build. Metadata fields such as name, version, and description are pulled directly from `package.json`, 
+keeping a single source of truth.
+
+🔧 **Package manager agnostic** — Generated projects are standard Node.js projects. Use npm, yarn, or pnpm —
+whichever you prefer.
+
+🎨 **CSS injection** — Import `.css` files from TypeScript as you normally would. At build time, styles are extracted 
+and bundled into the output script, then injected into the page at runtime — no manual DOM manipulation required.
+
+### Optional Features
+
+⚛️ **React** — Scaffold the project with React pre-configured, including type declarations for 
+`unsafeWindow.React` and `unsafeWindow.ReactDOM`, and utility functions for accessing them at runtime.
+
+🌊 **Tailwind CSS** — Adds Tailwind CSS v4 with the Vite plugin, so utility classes are compiled 
+at build time and only the CSS you actually use is injected into your userscript.
+
+✨ **Prettier** — Sets up Prettier with a pre-configured `.prettierrc` and `.prettierignore` for consistent formatting.
+
+🚀 **GitHub Actions workflows** — Includes CI/CD workflows that automatically create Git tags when 
+`package.json` version changes, and publish GitHub Releases with the built script attached.
+
+---
+
+## Quick Start
+
+### npm
+
+```bash
+npx create-tampermonkey-typescript
+```
+
+### yarn
+
+```bash
+yarn create tampermonkey-typescript
+```
+
+### pnpm
+
+```bash
+pnpm create tampermonkey-typescript
+```
+
+The CLI will walk you through the project configuration — name, version, description, author — and let you 
+select optional features (React, Git). The output is your new project folder containing its own `README.md`
+to get you started. You can preview that file here: [Generated Project README](templates/base/README.md)
+
+---
+
+## License
+
 [MIT](LICENSE)

package/dist/cli.js

@@ -45,12 +45,27 @@ const availableFeatures = [
         tsConfigModifier: (config) => (config.compilerOptions.jsx = 'react-jsx'),
         devDependencies: ['react', 'react-dom', '@types/react', '@types/react-dom'],
     },
+    {
+        name: 'TailwindCSS',
+        description: 'Adds TailwindCSS support to the project',
+        directory: path.join(TEMPLATES_DIR, 'tailwindcss'),
+        devDependencies: ['tailwindcss', '@tailwindcss/vite'],
+    },
+    {
+        name: 'Prettier',
+        description: 'Adds Prettier with default .prettierrc and .prettierignore files',
+        directory: path.join(TEMPLATES_DIR, 'prettier'),
+        hook: (params) => {
+            renameDotFiles(params, 'prettierrc', 'prettierignore');
+            execInProjectDir('npm install --save-dev --save-exact prettier', params);
+        },
+    },
     {
         name: 'Git',
         description: 'Initializes the new project as a git repository',
         directory: path.join(TEMPLATES_DIR, 'git'),
         hook: (params) => {
-            fs.renameSync(path.join(params.projectPath, '_gitignore'), path.join(params.projectPath, '.gitignore'));
+            renameDotFiles(params, 'gitignore');
             execInProjectDir(`git init && git add . && git commit -m "Initial commit"`, params);
         },
     },
@@ -282,4 +297,9 @@ function writeObjectToFile(object, fileName, params) {
 function execInProjectDir(command, params) {
     execSync(command, { stdio: 'inherit', cwd: params.projectPath });
 }
+function renameDotFiles(params, ...fileNames) {
+    for (const fileName of fileNames) {
+        fs.renameSync(path.join(params.projectPath, `_${fileName}`), path.join(params.projectPath, `.${fileName}`));
+    }
+}
 main().then(() => { }, (e) => console.error(kleur.red(e.message || e)));

package/package.json

@@ -1,49 +1,51 @@
-{
-  "name": "create-tampermonkey-typescript",
-  "version": "1.1.0",
-  "description": "CLI tool for generating a TamperMonkey script project written in typescript which is transpiled to JavaScript to be ran in the browser",
-  "license": "MIT",
-  "homepage": "https://github.com/neth392/create-tampermonkey-typescript",
-  "author": "neth392",
-  "keywords": [
-    "tampermonkey",
-    "typescript",
-    "template"
-  ],
-  "publishConfig": {
-    "access": "public",
-    "registry": "https://registry.npmjs.org/"
-  },
-  "files": [
-    "dist",
-    "templates"
-  ],
-  "type": "module",
-  "bin": {
-    "create-tampermonkey-typescript": "dist/cli.js"
-  },
-  "scripts": {
-    "build": "tsc",
-    "dev": "ts-node src/cli.ts"
-  },
-  "devDependencies": {
-    "@types/node": "^24.0.10",
-    "@types/prompts": "^2.4.9",
-    "@types/react": "^19.1.8",
-    "@types/react-dom": "^19.1.6",
-    "@types/tampermonkey": "^5.0.4",
-    "prettier": "^3.6.1",
-    "react": "^19.1.0",
-    "react-dom": "^19.1.0",
-    "ts-node": "^10.9.2",
-    "type-fest": "^5.4.4",
-    "typescript": "^5.8.3",
-    "vite": "^7.0.0",
-    "vite-plugin-banner": "^0.8.1",
-    "vite-plugin-css-injected-by-js": "^3.5.2"
-  },
-  "dependencies": {
-    "kleur": "^4.1.5",
-    "prompts": "^2.4.2"
-  }
-}
+{
+  "name": "create-tampermonkey-typescript",
+  "version": "1.2.1",
+  "description": "CLI tool for generating a TamperMonkey script project written in typescript which is transpiled to JavaScript to be ran in the browser",
+  "license": "MIT",
+  "homepage": "https://github.com/neth392/create-tampermonkey-typescript",
+  "author": "neth392",
+  "keywords": [
+    "tampermonkey",
+    "typescript",
+    "template"
+  ],
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "files": [
+    "dist",
+    "templates"
+  ],
+  "type": "module",
+  "bin": {
+    "create-tampermonkey-typescript": "dist/cli.js"
+  },
+  "scripts": {
+    "build": "tsc",
+    "dev": "ts-node src/cli.ts"
+  },
+  "devDependencies": {
+    "@tailwindcss/vite": "^4.1.18",
+    "@types/node": "^24.0.10",
+    "@types/prompts": "^2.4.9",
+    "@types/react": "^19.1.8",
+    "@types/react-dom": "^19.1.6",
+    "@types/tampermonkey": "^5.0.4",
+    "prettier": "^3.6.1",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
+    "tailwindcss": "^4.1.18",
+    "ts-node": "^10.9.2",
+    "type-fest": "^5.4.4",
+    "typescript": "^5.8.3",
+    "vite": "^7.0.0",
+    "vite-plugin-banner": "^0.8.1",
+    "vite-plugin-css-injected-by-js": "^3.5.2"
+  },
+  "dependencies": {
+    "kleur": "^4.1.5",
+    "prompts": "^2.4.2"
+  }
+}

package/templates/base/README.md

@@ -11,6 +11,8 @@
 - 📚 [Dependencies](#dependencies)
 - 🐒 [TamperMonkey API](#tampermonkey-api)
 - ⚛️ [React](#react)
+- 🌊 [TailwindCSS](#tailwind-css)
+- ✨ [Prettier](#prettier)
 - ⚙️ [GitHub Workflows](#github-workflows)
 
 
@@ -182,6 +184,43 @@ root.render(<App />)
 
 ---
 
+## Tailwind CSS
+
+Tailwind is configured via the `@tailwindcss/vite` plugin and imported in `src/styles.css`. Just use utility classes in your code — only the classes you reference will be included in the final build.
+```ts
+const el = document.createElement('div')
+el.className = 'bg-blue-500 text-white p-4 rounded'
+document.body.appendChild(el)
+```
+
+Or with React:
+```tsx
+const Badge = ({ text, color }: { text: string; color: string }) => (
+  <span className={`inline-block px-3 py-1 rounded-full text-sm font-semibold text-white ${color}`}>
+    {text}
+  </span>
+)
+
+const App = () => (
+  <div className="flex gap-2 p-4">
+    <Badge text="Online" color="bg-green-500" />
+    <Badge text="Away" color="bg-yellow-500" />
+    <Badge text="Offline" color="bg-red-500" />
+  </div>
+)
+
+```
+
+For more information, see the [Tailwind CSS docs](https://tailwindcss.com/docs).
+
+---
+
+## Prettier
+
+Prettier is included with a pre-configured `.prettierrc` and `.prettierignore` file. Feel free to change them to best fit your programming style.
+
+---
+
 ## GitHub Workflows
 
 > This section only applies if Git was enabled during project creation.

package/templates/base/src/script.ts

@@ -1,6 +1,6 @@
-/**
-This file is the entry point to your script.
- */
-
-// Imports your styles. Can be removed if no CSS is used.
-import '@/styles.css'
+/**
+This file is the entry point to your script.
+ */
+
+// Imports your styles. Can be removed if no CSS is used.
+import '@/styles.css'

package/templates/base/userscript.txt

@@ -1,7 +1,8 @@
-// ==UserScript==
-// @name           <name>
-// @version        <version>
-// @description    <description>
-// @author         <author>
-// @homepage       <homepage>
+// ==UserScript==
+// @name           <name>
+// @version        <version>
+// @description    <description>
+// @author         <author>
+// @namespace      <homepage>
+// @homepage       <homepage>
 // ==/UserScript==

package/templates/base/vite.config.ts

@@ -1,55 +1,60 @@
-/**
- * Configured by create-tampermonkey-typescript to combine your entire codebase into a single TamperMonkey-ready script.
- * You can modify it as you like.
- */
-
-import { defineConfig } from 'vite'
-import { resolve, dirname } from 'path'
-import { fileURLToPath } from 'url'
-import fs from 'fs'
-import cssInjectedByJsPlugin from 'vite-plugin-css-injected-by-js'
-import banner from 'vite-plugin-banner'
-
-const __filename = fileURLToPath(import.meta.url)
-const __dirname = dirname(__filename)
-
-const pkg = JSON.parse(fs.readFileSync(resolve(__dirname, 'package.json'), 'utf8'))
-const hasReact = pkg.devDependencies?.react || pkg.dependencies?.react
-
-// Replaced in the script's header to keep package.json as the source of truth.
-const metaTags = {
-  '<name>': pkg.name,
-  '<version>': pkg.version,
-  '<description>': pkg.description,
-  '<author>': pkg.author,
-  '<homepage>': pkg.homepage,
-}
-
-let meta = fs.readFileSync(resolve(__dirname, 'userscript.txt'), 'utf8')
-
-for (const [tagName, tagValue] of Object.entries(metaTags).filter(([_, v]) => v)) {
-  meta = meta.replace(tagName, tagValue)
-}
-
-export default defineConfig({
-  resolve: {
-    alias: {
-      '@': resolve(__dirname, 'src'),
-    },
-  },
-  plugins: [cssInjectedByJsPlugin({ topExecutionPriority: true }), banner({ content: meta, verify: false })],
-  build: {
-    cssCodeSplit: false,
-    lib: {
-      entry: resolve(__dirname, 'src/script.ts'),
-      name: pkg.name.replace(/[^a-zA-Z0-9]/g, '_'),
-      formats: ['iife'],
-      fileName: () => `script.user.js`,
-    },
-    rollupOptions: {
-      ...(hasReact ? { external: ['react', 'react-dom/client'] } : {}),
-    },
-    outDir: 'dist',
-    minify: false,
-  },
-})
+/**
+ * Configured by create-tampermonkey-typescript to combine your entire codebase into a single TamperMonkey-ready script.
+ * You can modify it as you like.
+ */
+
+import { defineConfig } from 'vite'
+import { resolve, dirname } from 'path'
+import { fileURLToPath } from 'url'
+import fs from 'fs'
+import cssInjectedByJsPlugin from 'vite-plugin-css-injected-by-js'
+import banner from 'vite-plugin-banner'
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = dirname(__filename)
+
+const pkg = JSON.parse(fs.readFileSync(resolve(__dirname, 'package.json'), 'utf8'))
+const hasReact = pkg.devDependencies?.react || pkg.dependencies?.react
+const hasTailwind = pkg.devDependencies?.['@tailwindcss/vite'] || pkg.dependencies?.['@tailwindcss/vite']
+
+// Replaced in the script's header to keep package.json as the source of truth.
+const metaTags = {
+  '<name>': pkg.name,
+  '<version>': pkg.version,
+  '<description>': pkg.description,
+  '<author>': pkg.author,
+  '<homepage>': pkg.homepage,
+}
+
+let meta = fs.readFileSync(resolve(__dirname, 'userscript.txt'), 'utf8')
+
+for (const [tagName, tagValue] of Object.entries(metaTags).filter(([_, v]) => v)) {
+  meta = meta.replaceAll(tagName, tagValue)
+}
+
+export default defineConfig({
+  resolve: {
+    alias: {
+      '@': resolve(__dirname, 'src'),
+    },
+  },
+  plugins: [
+    ...(hasTailwind ? [(await import('@tailwindcss/vite')).default()] : []),
+    cssInjectedByJsPlugin({ topExecutionPriority: true }),
+    banner({ content: meta, verify: false }),
+  ],
+  build: {
+    cssCodeSplit: false,
+    lib: {
+      entry: resolve(__dirname, 'src/script.ts'),
+      name: pkg.name.replace(/[^a-zA-Z0-9]/g, '_'),
+      formats: ['iife'],
+      fileName: () => `script.user.js`,
+    },
+    rollupOptions: {
+      ...(hasReact ? { external: ['react', 'react-dom/client'] } : {}),
+    },
+    outDir: 'dist',
+    minify: false,
+  },
+})

package/templates/git/_gitignore

@@ -1,28 +1,28 @@
-# Project Specific
-dist/
-
-# Node
-node_modules/
-.vite/
-
-# Logs
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-pnpm-debug.log*
-
-# OS-specific
-.DS_Store
-Thumbs.db
-
-# VSCode
-.vscode/
-
-# Webstorm
-.idea
-
-# TypeScript
-*.tsbuildinfo
-
-# Prettier/Editor
+# Project Specific
+dist/
+
+# Node
+node_modules/
+.vite/
+
+# Logs
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# OS-specific
+.DS_Store
+Thumbs.db
+
+# VSCode
+.vscode/
+
+# Webstorm
+.idea
+
+# TypeScript
+*.tsbuildinfo
+
+# Prettier/Editor
 .prettiercache/

package/templates/github-workflows/.github/workflows/auto-tag.yml

@@ -1,42 +1,42 @@
-# .github/workflows/auto-tag.yml
-name: Auto Tag from package.json
-
-permissions:
-  contents: write
-
-on:
-  push:
-    branches:
-      - master
-
-jobs:
-  tag:
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 0  # Required to push tags
-
-      - name: Setup Node
-        uses: actions/setup-node@v4
-        with:
-          node-version: '20'
-
-      - name: Read version from package.json
-        id: pkg
-        run: |
-          VERSION=$(node -p "require('./package.json').version")
-          echo "PACKAGE_VERSION=$VERSION" >> $GITHUB_ENV
-          echo "TAG_NAME=v$VERSION" >> $GITHUB_ENV
-
-      - name: Create tag if not exists
-        run: |
-          if git rev-parse "$TAG_NAME" >/dev/null 2>&1; then
-            echo "Tag $TAG_NAME already exists. Skipping."
-          else
-            git config user.name "github-actions[bot]"
-            git config user.email "41898282+github-actions[bot]@users.noreply.github.com"
-            git tag $TAG_NAME
-            git push origin $TAG_NAME
+# .github/workflows/auto-tag.yml
+name: Auto Tag from package.json
+
+permissions:
+  contents: write
+
+on:
+  push:
+    branches:
+      - master
+
+jobs:
+  tag:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0  # Required to push tags
+
+      - name: Setup Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+
+      - name: Read version from package.json
+        id: pkg
+        run: |
+          VERSION=$(node -p "require('./package.json').version")
+          echo "PACKAGE_VERSION=$VERSION" >> $GITHUB_ENV
+          echo "TAG_NAME=v$VERSION" >> $GITHUB_ENV
+
+      - name: Create tag if not exists
+        run: |
+          if git rev-parse "$TAG_NAME" >/dev/null 2>&1; then
+            echo "Tag $TAG_NAME already exists. Skipping."
+          else
+            git config user.name "github-actions[bot]"
+            git config user.email "41898282+github-actions[bot]@users.noreply.github.com"
+            git tag $TAG_NAME
+            git push origin $TAG_NAME
           fi

package/templates/github-workflows/.github/workflows/release.yml

@@ -1,56 +1,56 @@
-name: Build & Release Tampermonkey Script
-
-permissions:
-  contents: write
-
-on:
-  workflow_run:
-    workflows: ["Auto Tag from package.json"]
-    types:
-      - completed
-
-jobs:
-  release:
-    if: ${{ github.event.workflow_run.conclusion == 'success' }}
-    runs-on: ubuntu-latest
-
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
-          fetch-tags: true
-
-      - name: Set up Node.js
-        uses: actions/setup-node@v4
-        with:
-          check-latest: true
-
-      - name: Install dependencies
-        run: npm ci
-
-      - name: Build script
-        run: npm run build
-
-      - name: Get package name
-        id: pkg
-        run: |
-          NAME=$(node -p "require('./package.json').name")
-          echo "PACKAGE_NAME=$NAME" >> $GITHUB_ENV
-
-      - name: Get latest tag from Git
-        id: tag
-        run: |
-          git fetch --tags
-          TAG=$(git describe --tags --abbrev=0)
-          echo "TAG_NAME=$TAG" >> $GITHUB_ENV
-          echo "Latest tag: $TAG"
-
-      - name: Create GitHub Release
-        uses: softprops/action-gh-release@v2
-        with:
-          name: ${{ env.PACKAGE_NAME }}  ${{ env.TAG_NAME }}
-          tag_name: ${{ env.TAG_NAME }}
-          files: dist/script.user.js
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+name: Build & Release Tampermonkey Script
+
+permissions:
+  contents: write
+
+on:
+  workflow_run:
+    workflows: ["Auto Tag from package.json"]
+    types:
+      - completed
+
+jobs:
+  release:
+    if: ${{ github.event.workflow_run.conclusion == 'success' }}
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+          fetch-tags: true
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          check-latest: true
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build script
+        run: npm run build
+
+      - name: Get package name
+        id: pkg
+        run: |
+          NAME=$(node -p "require('./package.json').name")
+          echo "PACKAGE_NAME=$NAME" >> $GITHUB_ENV
+
+      - name: Get latest tag from Git
+        id: tag
+        run: |
+          git fetch --tags
+          TAG=$(git describe --tags --abbrev=0)
+          echo "TAG_NAME=$TAG" >> $GITHUB_ENV
+          echo "Latest tag: $TAG"
+
+      - name: Create GitHub Release
+        uses: softprops/action-gh-release@v2
+        with:
+          name: ${{ env.PACKAGE_NAME }}  ${{ env.TAG_NAME }}
+          tag_name: ${{ env.TAG_NAME }}
+          files: dist/script.user.js
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

package/templates/prettier/_prettierignore

@@ -0,0 +1,3 @@
+dist/
+node_modules/
+*.user.js

package/templates/prettier/_prettierrc

@@ -0,0 +1,7 @@
+{
+  "trailingComma": "es5",
+  "tabWidth": 2,
+  "semi": false,
+  "singleQuote": true,
+  "printWidth": 120
+}

package/templates/react/src/global.d.ts

@@ -1,14 +1,14 @@
-/**
- * A reference to the global `window` object, extended with additional properties
- * for React and ReactDOM.
- *
- * @type {Window & {React: typeof import('react'), ReactDOM: typeof import('react-dom/client')}}
- * @property {typeof import('react')} React - The React library, providing tools
- *     for building user interfaces.
- * @property {typeof import('react-dom/client')} ReactDOM - The ReactDOM library,
- *     allowing React components to be rendered into the DOM.
- */
-declare const unsafeWindow: Window & {
-  React: typeof import('react')
-  ReactDOM: typeof import('react-dom/client')
-}
+/**
+ * A reference to the global `window` object, extended with additional properties
+ * for React and ReactDOM.
+ *
+ * @type {Window & {React: typeof import('react'), ReactDOM: typeof import('react-dom/client')}}
+ * @property {typeof import('react')} React - The React library, providing tools
+ *     for building user interfaces.
+ * @property {typeof import('react-dom/client')} ReactDOM - The ReactDOM library,
+ *     allowing React components to be rendered into the DOM.
+ */
+declare const unsafeWindow: Window & {
+  React: typeof import('react')
+  ReactDOM: typeof import('react-dom/client')
+}

package/templates/react/src/util/react-util.ts

@@ -1,24 +1,24 @@
-/**
- * Optional utility file for easily accessing the React & ReactDOM objects at runtime.
- */
-
-import type React from 'react'
-import type ReactDOM from 'react-dom/client'
-
-/**
- * Retrieves the React object from the global `unsafeWindow` scope.
- *
- * @return {typeof React} The React object from the global scope.
- */
-export function getReact(): typeof React {
-  return unsafeWindow.React
-}
-
-/**
- * Retrieves the ReactDOM object from the global `unsafeWindow` object.
- *
- * @return {typeof ReactDOM} The ReactDOM reference from the global scope.
- */
-export function getReactDOM(): typeof ReactDOM {
-  return unsafeWindow.ReactDOM
-}
+/**
+ * Optional utility file for easily accessing the React & ReactDOM objects at runtime.
+ */
+
+import type React from 'react'
+import type ReactDOM from 'react-dom/client'
+
+/**
+ * Retrieves the React object from the global `unsafeWindow` scope.
+ *
+ * @return {typeof React} The React object from the global scope.
+ */
+export function getReact(): typeof React {
+  return unsafeWindow.React
+}
+
+/**
+ * Retrieves the ReactDOM object from the global `unsafeWindow` object.
+ *
+ * @return {typeof ReactDOM} The ReactDOM reference from the global scope.
+ */
+export function getReactDOM(): typeof ReactDOM {
+  return unsafeWindow.ReactDOM
+}

package/templates/tailwindcss/src/styles.css

@@ -0,0 +1,2 @@
+/* Add all styles here, keep tailwindcss import for using tailwind */
+@import 'tailwindcss';

package/templates/tsconfig.json

@@ -1,16 +1,16 @@
-{
-  "compilerOptions": {
-    "jsx": "react-jsx",
-    "types": ["vite/client", "node"],
-    "target": "ES2022",
-    "module": "ESNext",
-    "moduleResolution": "nodenext",
-    "strict": true,
-    "esModuleInterop": true,
-    "forceConsistentCasingInFileNames": true,
-    "skipLibCheck": true,
-    "resolveJsonModule": true,
-    "lib": ["ES2022", "dom", "dom.iterable"]
-  },
-  "include": ["template/src", "react"]
-}
+{
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "types": ["vite/client", "node"],
+    "target": "ES2022",
+    "module": "ESNext",
+    "moduleResolution": "nodenext",
+    "strict": true,
+    "esModuleInterop": true,
+    "forceConsistentCasingInFileNames": true,
+    "skipLibCheck": true,
+    "resolveJsonModule": true,
+    "lib": ["ES2022", "dom", "dom.iterable"]
+  },
+  "include": ["template/src", "react"]
+}