yarn-workspaces-eslint-cspell-commitlint-lefthook-template

Features

• Yarn Workspaces
• Corepack
  • https://yarnpkg.com/corepack
  • https://yarnpkg.com/blog/release/4.0
  • https://nodejs.org/api/corepack.html

Flat ESLint

With awesome eslint-canonical-config.

My ESLint Rules

• JS/TS empty lines for formatting

• Auto-fix type to interface for React Component Props. Interface uses overriding with backward compatibility.

  // Bad example
  type BadInputProps = ComponentPropsWithRef<'input'> & {
    type: number; // no error and input gets invalid property :(
  };
  
  // Good example
  interface GoodInputProps extends ComponentPropsWithRef<'input'> {
    type: number; // typescript error :)
  }

• Auto-fix React Component Display Name for React Dev Tools

  // you write only
  YourComp.displayName = '';

  // after auto-fix
  YourComp.displayName = 'YourComp';

How to use

• corepack enable
• git clone this repository
• use it or something else from my favorites
  • tsx — the easiest way to run TypeScript in Node.js
  • pkgroll — the zero-config package bundler used by tsx!
  • vitest — Next generation testing framework powered by Vite
  • trpc — End-to-end typesafe APIs
  • Front-end
    • vite — Next Generation Frontend Tooling
    • next — The React Framework for the Web
    • @vanilla-extract/css — Zero-runtime Stylesheets-in-TypeScript