utils
Code

Prettier Config

Prettier config for projects.

Install

pnpm add -D prettier @ianvs/prettier-plugin-sort-imports prettier-plugin-tailwindcss
.prettierrc
{
  "tabWidth": 4,
  "singleQuote": false,
  "trailingComma": "es5",
  "arrowParens": "always",
 
  "plugins": [
    "@ianvs/prettier-plugin-sort-imports",
    "prettier-plugin-tailwindcss"
  ],
  "tailwindFunctions": ["cn", "cva"],
  "importOrderParserPlugins": [
    "typescript",
    "jsx",
    "explicitResourceManagement"
  ],
  "importOrder": [
    "<TYPES>",
    "^(react/(.*)$|^(react$))",
    "^(next/(.*)$|^(next$))",
    "<THIRD_PARTY_MODULES>",
    "",
    "",
    "<TYPES>^[.|..|~]",
    "^~/",
    "^@/",
    "^[./]",
    "^[../]"
  ]
}
package.json
{
  "scripts": {
    "format": "prettier --write \"**/*.{ts,tsx,md,js,jsx,mjs,json,mdx}\""
  }
}

On this page