Comparative Analysis: Pros and Cons of TS-Standard vs ESLint and Prettier

[athuv]

This discussion will explore the advantages and disadvantages of using TS-Standard versus ESLint and Prettier in a NextJS project that also employs TailwindCSS. We will examine the features, ease of integration, performance, customizability, and compatibility with TypeScript in different scenarios. The aim is to provide a comprehensive understanding of these tools to aid in making informed decisions about which one(s) to adopt in our projects. Let's dive in and share our experiences and insights.

[athuv]

Prettier, when paired with the prettier-plugin-tailwindcss, provides a seamless experience with TailwindCSS. It automatically sorts classes according to the recommended class order by TailwindCSS. Furthermore, it can automatically arrange HTML elements upon saving files.

ESLint offers the advantage of enforcing style guides and best practices. You can choose from various established guides like Airbnb or Google, which makes it easier to maintain consistency across your codebase. ESLint is easy to manage and configure, thanks to its well-defined documentation. It has robust integration with Visual Studio Code and boasts a large, active community for support.

[musoke]

This repo currently uses ts-standard for linting and formatting. As far as I can tell, ts-standard is one of the many ESLint styles. Am I missing something?

[vnugent]

As @musoke said, ts-standard or js-standard is an opinionated set of eslint rules and code formatter used by many projects. The default Visual Studio Code formatter uses different rules to format so make sure you install the following 2 extensions:

• https://marketplace.visualstudio.com/items?itemName=standard.vscode-standard
• https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss#review-details

we should add this to the readme file.