Prettier

The Prettier plugin adds automatic code formatting to your project. During the install process, you are prompted:

Would you like to use Prettier for code formatting?

If you accept, the plugin installs Prettier and creates configuration files. If you decline (or later disable it during a reinstall), the plugin removes all Prettier-related files and packages.

Three dev dependencies:

• prettier - Core formatter
• prettier-plugin-tailwindcss - Sorts Tailwind CSS classes according to the recommended order
• @trivago/prettier-plugin-sort-imports - Sorts and groups import statements

A format script is added to package.json:

{
  "scripts": {
    "format": "prettier --write ."
  }
}

{
  "semi": true,
  "singleQuote": true,
  "tabWidth": 2,
  "trailingComma": "es5",
  "printWidth": 100,
  "plugins": [
    "prettier-plugin-tailwindcss",
    "@trivago/prettier-plugin-sort-imports"
  ],
  "importOrder": [
    "^react",
    "^next",
    "<THIRD_PARTY_MODULES>",
    "^@/(.*)$",
    "^[./]"
  ],
  "importOrderSeparation": true,
  "importOrderSortSpecifiers": true
}

Import ordering groups imports in this order:

1. React imports
2. Next.js imports
3. Third-party modules
4. Path-aliased imports (@/...)
5. Relative imports

Each group is separated by a blank line.

node_modules
.next
dist
build
coverage
*.min.js
*.min.css
pnpm-lock.yaml
package-lock.json
yarn.lock

Format all files:

npm run format

The generated .prettierrc and .prettierignore files are standard Prettier configuration files that you own after installation. You can freely modify them to suit your project's needs -- for example, changing printWidth, adjusting importOrder groups, adding plugins, or updating the ignore list. These files are not overwritten by subsequent woonext reinstall runs as long as Prettier remains enabled.

If Prettier was previously enabled and you run npx woonext reinstall and decline the Prettier prompt, the plugin will:

1. Delete .prettierrc and .prettierignore
2. Uninstall prettier, prettier-plugin-tailwindcss, and @trivago/prettier-plugin-sort-imports