1. stylomatic
<img src="media/stylomatic.png" width="363" align="right">
stylomatic
Package: stylomatic
Last modified: Tue, 17 Oct 2023 13:50:52 GMT
Version: 0.8.1
License: MIT
Downloads: 426

Install

npm install stylomatic
yarn add stylomatic

stylomatic npm version

Styles, configs, and tools for modern Typescript with zero configuration

  • :lipstick: Core styles based on @antfu/config covering Typescript, React, best practices, and even package.json ordering and formatting, and more.
  • :high_brightness: formatting is almost similar to Prettier, without the added burden of it on eslint
  • :computer: Typescript config for various usecases
  • :hammer: Tools: esno, tsup and intergrations ts-jest, and more.

Install

yarn add --dev stylomatic

Usage

Bootstrap quickly:

yarn stylomatic

Will give you a starter .eslint.js and tsconfig.json.

Add prettier with your package manager (we do this manually because of package manager incompatibilities):

 "eslint-config-prettier": "^8.8.0",
"eslint-plugin-prettier": "^4.2.1",
"prettier": "^2.8.8",

Tooling deps

Starting v0.5.0, moved to here, instead of installed by default to be more compatible with how different package managers handle bins. Put these in root of your monorepo if needed:

     "jest": "^28.1.1",
    "ts-jest": "^29.0.3",
    "tsup": "^6.1.0",
    "typescript-cp": "^0.1.5",
    "typescript": "^4.7.3",
    "concurrently": "^7.2.1",
    "rimraf": "^3.0.2",
    "tsc-alias": "^1.6.9"

Quick start

$ mkdir myproject && cd myproject
$ yarn init -y && yarn add --dev stylomatic

$ yarn stylomatic
added .eslint.js
added tsconfig.json

$ mkdir src
$ cat > src/index.ts
console.log("hello unstyled world");

$ yarn eslint src/index.ts

src/index.ts
  1:1   error  Unexpected console statement                                       no-console

✖ 2 problems (2 errors, 0 warnings)
  1 error and 0 warnings potentially fixable with the `--fix` option.

Recommended config

In your .eslint.js:

 module.exports = require('stylomatic/eslint-preset')

And in your tsconfig.json:

 {
  "extends": "stylomatic/node-library.json",
  "compilerOptions": {
    "outDir": "dist",
    "strict": false,
    "isolatedModules": false
  },
  "include": [
    "./src",
    "./test"
  ],
  "exclude": [
    "**/__tests__/",
    "test/fixtures"
  ]
}

RELATED POST

10 Must-Know Windows Shortcuts That Will Save You Time

10 Must-Know Windows Shortcuts That Will Save You Time

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Navigating AWS Networking: Essential Hacks for Smooth Operation

Navigating AWS Networking: Essential Hacks for Smooth Operation

Achieving Stunning Visuals with Unity's Global Illumination

Achieving Stunning Visuals with Unity's Global Illumination

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code