✨ Configured Vite (ESM-only, vanilla-ts template, removed default app files)

2025-04-29 13:20:05 +02:00
parent 20308c5a6d
commit c9b2d778be
8 changed files with 457 additions and 0 deletions
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
@@ -0,0 +1,15 @@
+{
+  "name": "tiny-pattern-ts",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "preview": "vite preview"
+  },
+  "devDependencies": {
+    "typescript": "~5.7.2",
+    "vite": "^6.3.1"
+  }
+}
@@ -0,0 +1,295 @@
+# Project Specifications for TypeScript NPM Module
+
+- name of package: tiny-pattern-ts
+
+## 0. References
+
+typescript-lib-starter-tiny => https://github.com/tmueller/typescript-lib-starter-tiny/
+
+## 1. Development Environment
+
+- **TypeScript**: Use strictest rules (via npm package "@tsconfig/strictest", additional strictures)
+- **EditorConfig**: Use `.editorconfig` from typescript-lib-starter-tiny
+- **Prettier**: For code formatting, integrated with ESLint
+- **ESLint**: Strictest type-checked rules, integrated with Prettier
+- **Import Sorting**: Via Prettier or ESLint
+- **cspell**: Basic spelling configuration
+- **Lefthook**: Pre-commit checks for:
+
+   - Type checking
+   - Spelling
+   - Package sorting
+   - Linting
+   - Formatting
+   - Outdated Packages
+
+- **Additional Dev Dependencies**:
+
+   - lefthook
+   - sort-package-json
+   - check-outdated
+
+## 2. Build & Test
+
+- **Build Tool**: Vite (ESM only, no CJS)
+- **Testing**: Vitest
+- **TypeScript Build Output**: `dist` directory
+- **Additional Runtime Dependencies**:
+   - tslib
+   - type-fest
+
+## 3. Project Structure & Files
+
+- __.gitignore__: Ignore `dist`, `node_modules`, and other common files
+- **.npmignore**: Ignore `src` and other non-dist files
+- **LICENSE**: MIT
+- **README.md**: Scaffolded
+- **commit-message-template**: From typescript-lib-starter-tiny
+- **Target Environments**: Browser and latest LTS Node.js
+- **No React, No CJS, ESM only**
+
+## 4. Automation & Quality
+
+- **Version Automation**: Use standard `npm version` for versioning
+- **Unused Dependency Check**: Use `check-outdated` with config
+- **No commitlint, no conventional commits**
+
+## 5. Scripts (Clustered as in typescript-lib-starter-tiny, named similarly)
+
+### SETUP
+
+- `use:git-commit-message`: Set up commit message template (if needed)
+
+### TEST
+
+- `test`: Run typecheck and all tests
+- `test:unit`: Run unit tests with Vitest
+- `test:ci`: Run tests in CI mode (with coverage, fail-fast)
+
+### BUILD
+
+- `build`: Build the project using Vite
+
+### CLEAN
+
+- `clean`: Clean build output
+- `clean:build`: Remove dist directory
+
+### CHECK
+
+- `check`: Run all checks (lint, spell, typecheck, import/package sort, outdated)
+- `check:eslint`: Run ESLint
+- `check:prettier`: Check formatting with Prettier
+- `check:cspell`: Run cspell
+- `check:tsc`: TypeScript typecheck (no emit)
+- `check:package`: Check package.json sort
+- `check:outdated`: Check for unused/outdated dependencies
+
+### FIX
+
+- `fix`: Run all fixers (eslint, prettier, package sort)
+- `fix:eslint`: Auto-fix ESLint issues
+- `fix:prettier`: Auto-fix formatting with Prettier
+- `fix:package`: Auto-fix package.json sort
+
+### HOOKS
+
+- Lefthook will run relevant scripts on staged files for pre-commit (typecheck, lint, spell, sort, format, check:outdated)
+
+---
+
+## 6. Repository & CI/CD
+
+- **Repository**: Hosted on GitHub
+- **Build Pipeline**: Use GitHub Actions for CI/CD
+   - On push and pull request: run build, lint, typecheck, test:ci, spell, check:outdated
+   - On release (tagged commit): publish to npm
+
+## 7. Versioning & Publishing
+
+- **Version Update**: Use `npm version` to bump version after merging to main and before publishing
+- **Publishing to npm**: Only publish from CI on tagged commits (e.g., after version bump and release notes)
+- **Recommended Workflow**:
+   1. Develop and merge PRs to main
+   2. Run all checks via CI
+   3. Bump version with `npm version <patch|minor|major>`
+   4. Push tag to GitHub
+   5. CI builds and publishes to npm on tag
+
+## 8. NPM Keywords
+
+- pattern-matching
+- pattern
+- match
+- algebraic-data-types
+- adt
+- typescript
+
+> The library is for pattern matching (not regex), similar to F#'s pattern matching, for TypeScript/ESM environments.
+
+## 9. Code Coverage
+
+- **Configuration**:
+
+```ts
+import { defineConfig } from 'vitest/config';
+export default defineConfig({
+  test: {
+    coverage: {
+      reporter: ['text', 'html', 'lcov'],
+      include: ['src/**/*.ts'],
+      exclude: ['src/**/*.test.ts', 'test/**'],
+    },
+  },
+});
+```
+
+- Coverage reports: text summary, HTML, and lcov formats
+
+- Add coverage thresholds if desired
+
+- **CI**: Ensure coverage is generated and optionally uploaded as an artifact or checked for minimum thresholds
+
+## 10. Source Structure & Tree Shaking
+
+- **Source Directory**: All source code resides in `src/` and is exported via `src/index.ts`.
+- **Configuration**:
+   - Ensure `sideEffects: false` in `package.json`
+   - Use ESM-only exports
+   - Avoid top-level side effects in modules
+   - Prefer explicit exports in `index.ts` for best results
+- the human will implement the source code
+
+## 11. Included Templates from typescript-lib-starter-tiny
+
+### .editorconfig
+
+```plaintext
+# Editor configuration, see http://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 4
+insert_final_newline = true
+max_line_length = 80
+trim_trailing_whitespace = true
+quote_type = double
+
+[*.md]
+max_line_length = 0
+trim_trailing_whitespace = false
+
+[COMMIT_EDITMSG]
+max_line_length = 0
+```
+
+### commit-message-template
+
+```plaintext
+# If applied, this commit will... (Max 50 char)
+
+
+# Explain why this change is being made (Max 72 Char) [WHAT and WHY vs HOW]
+
+
+# Provide links or keys to any relevant tickets, articles or other resources
+Resolves #...
+
+# --- COMMIT END ---
+# Remember to
+#    Use the imperative mood in the subject line
+#    Capitalize the subject line
+#    Do not end the subject line with a period
+#    Separate subject from body with a blank line
+#    Use the body to explain what and why vs. how
+#    Can use multiple lines with "-" for bullet points in body
+```
+
+### README.md Structure (to scaffold)
+
+- Project title and description
+- Development
+  - Build: `npm run build`
+  - Test: `npm run test`, `npm run test:ci`
+  - Checks: `npm run check`, `npm run fix`
+- VSCode integration
+  - Debugging
+  - Running tests
+- Document workflows like 
+   - Version updates
+   - Changelog automation
+   - Publishing
+- Contribution guidelines
+  - Commit signing (GPG)
+  - How to set up commit message template
+  - Reference to commit-message-template
+
+## 12. Project Initialization & Commit Strategy
+
+- Start by initilizing git with a main branch
+- Initial commit: add an empty README.md
+- create a feature branch: `feature/setup`
+- For each technology or tool added (and its configuration), create a separate commit:
+  - Prepend each commit message with a matching gitmoji (e.g., :sparkles: for new features, :wrench: for config, etc.)
+  - Example commit messages:
+    - :tada: Initial commit with empty README
+    - :sparkles: Configured Vite (Vite-specific setup)
+    - :sparkles: Configured TypeScript (may be merged with Vite if dependent)
+    - :wrench: Configured ESLint
+    - :wrench: Configured Prettier
+    - ...and so on for each technology/tool
+- Each commit should include only the relevant files and configuration for that technology/tool
+- This approach ensures a clean, understandable project history and makes it easy to review or revert specific setup steps
+
+
+## 13. Changelog Automation
+
+- Use a tool like standard-version or changesets to automate changelog generation from commit messages or PRs.
+- Ensure changelog is updated as part of the release process.
+
+## 14. Publishing Public
+
+- Configure npm publishing to be public by default.
+- Add `"publishConfig": { "access": "public" }` to package.json.
+- Ensure CI/CD pipeline publishes with public access.
+
+## 15. VSCode Integration
+
+- Add a `.vscode/settings.json` with the following content:
+
+```json
+{
+    "typescript.tsdk": "node_modules/typescript/lib",
+    "[typescript]": {
+        "editor.defaultFormatter": "esbenp.prettier-vscode",
+        "editor.formatOnSave": true
+    },
+    "[json]": {
+        "editor.defaultFormatter": "esbenp.prettier-vscode",
+        "editor.formatOnSave": true
+    },
+    "[mdx]": {
+        "editor.defaultFormatter": "esbenp.prettier-vscode",
+        "editor.formatOnSave": true
+    },
+    "editor.defaultFormatter": "esbenp.prettier-vscode",
+    "editor.formatOnSave": true,
+    "[javascript]": {
+        "editor.defaultFormatter": "esbenp.prettier-vscode",
+        "editor.formatOnSave": true
+    }
+}
+```
+
+- Add `.vscode/extensions.json` with recommended extensions:
+  - `esbenp.prettier-vscode` (Prettier)
+  - `dbaeumer.vscode-eslint` (ESLint)
+  - `streetsidesoftware.code-spell-checker` (cspell)
+  - `vitest.explorer` (for test integration)
+  - `ms-vscode.vscode-typescript-next` (for latest TS features, optional)
+
+- Add `.vscode/tasks.json` for common tasks (optional):
+  - Build, test, lint, typecheck, format, spell, check:outdated
+- Ensure VSCode uses workspace TypeScript version and Prettier for formatting
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
@@ -0,0 +1,96 @@
+:root {
+  font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
+  line-height: 1.5;
+  font-weight: 400;
+
+  color-scheme: light dark;
+  color: rgba(255, 255, 255, 0.87);
+  background-color: #242424;
+
+  font-synthesis: none;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+a {
+  font-weight: 500;
+  color: #646cff;
+  text-decoration: inherit;
+}
+a:hover {
+  color: #535bf2;
+}
+
+body {
+  margin: 0;
+  display: flex;
+  place-items: center;
+  min-width: 320px;
+  min-height: 100vh;
+}
+
+h1 {
+  font-size: 3.2em;
+  line-height: 1.1;
+}
+
+#app {
+  max-width: 1280px;
+  margin: 0 auto;
+  padding: 2rem;
+  text-align: center;
+}
+
+.logo {
+  height: 6em;
+  padding: 1.5em;
+  will-change: filter;
+  transition: filter 300ms;
+}
+.logo:hover {
+  filter: drop-shadow(0 0 2em #646cffaa);
+}
+.logo.vanilla:hover {
+  filter: drop-shadow(0 0 2em #3178c6aa);
+}
+
+.card {
+  padding: 2em;
+}
+
+.read-the-docs {
+  color: #888;
+}
+
+button {
+  border-radius: 8px;
+  border: 1px solid transparent;
+  padding: 0.6em 1.2em;
+  font-size: 1em;
+  font-weight: 500;
+  font-family: inherit;
+  background-color: #1a1a1a;
+  cursor: pointer;
+  transition: border-color 0.25s;
+}
+button:hover {
+  border-color: #646cff;
+}
+button:focus,
+button:focus-visible {
+  outline: 4px auto -webkit-focus-ring-color;
+}
+
+@media (prefers-color-scheme: light) {
+  :root {
+    color: #213547;
+    background-color: #ffffff;
+  }
+  a:hover {
+    color: #747bff;
+  }
+  button {
+    background-color: #f9f9f9;
+  }
+}
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="32" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path fill="#007ACC" d="M0 128v128h256V0H0z"></path><path fill="#FFF" d="m56.612 128.85l-.081 10.483h33.32v94.68h23.568v-94.68h33.321v-10.28c0-5.69-.122-10.444-.284-10.566c-.122-.162-20.4-.244-44.983-.203l-44.74.122l-.121 10.443Zm149.955-10.742c6.501 1.625 11.459 4.51 16.01 9.224c2.357 2.52 5.851 7.111 6.136 8.208c.08.325-11.053 7.802-17.798 11.988c-.244.162-1.22-.894-2.317-2.52c-3.291-4.795-6.745-6.867-12.028-7.233c-7.76-.528-12.759 3.535-12.718 10.321c0 1.992.284 3.17 1.097 4.795c1.707 3.536 4.876 5.649 14.832 9.956c18.326 7.883 26.168 13.084 31.045 20.48c5.445 8.249 6.664 21.415 2.966 31.208c-4.063 10.646-14.14 17.879-28.323 20.276c-4.388.772-14.79.65-19.504-.203c-10.28-1.828-20.033-6.908-26.047-13.572c-2.357-2.6-6.949-9.387-6.664-9.874c.122-.163 1.178-.813 2.356-1.504c1.138-.65 5.446-3.129 9.509-5.485l7.355-4.267l1.544 2.276c2.154 3.29 6.867 7.801 9.712 9.305c8.167 4.307 19.383 3.698 24.909-1.26c2.357-2.153 3.332-4.388 3.332-7.68c0-2.966-.366-4.266-1.91-6.501c-1.99-2.845-6.054-5.242-17.595-10.24c-13.206-5.69-18.895-9.224-24.096-14.832c-3.007-3.25-5.852-8.452-7.03-12.8c-.975-3.617-1.22-12.678-.447-16.335c2.723-12.76 12.353-21.659 26.25-24.3c4.51-.853 14.994-.528 19.424.569Z"></path></svg>
@@ -0,0 +1 @@
+/// <reference types="vite/client" />
@@ -0,0 +1,24 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "useDefineForClassFields": true,
+    "module": "ESNext",
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "isolatedModules": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["src"]
+}
				`@@ -0,0 +1 @@`
				<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>