stylelint VS prettier

Another common way to extend configs in linters is using the extends key in the configuration file. Let's take StyleLint as an example:

Stylelint is similar to ESLint, but its focus is on styling rather than JavaScript. It helps you find errors in style files, such as old syntax or empty classes. We will also incorporate stylelint-config-clean-order to sort your style rules and group them consistently across the entire codebase.

The “cost of loading modules” diagram shows non-linear behaviour (though you should largely ignore the curve visible in the diagram because the x axis is way off linear):

• 0.15s ÷ 500 = 0.3ms

• 0.31s ÷ 1000 = 0.31ms

• 3.12s ÷ 10000 = 0.312ms

• 16.81s ÷ 25000 = 0.6724ms

• 48.44s ÷ 50000 = 0.9688ms

My own observation on a Surface Book six years ago was that in Node.js under Windows, each module had about 1ms of overhead when there was warm file system cache—that is, simply bundling with Rollup saved 1ms per file. If this sort of thing interests you, quite a lot of useful stuff came out of https://github.com/stylelint/stylelint/issues/2454 which I filed because I was unhappy with stylelint taking over a second to import. And that must have been only in the order of one or two thousand modules, when the behaviour is still close enough to linear.

Document your build process in a blog, use eslint, stylelint and jsx-a11y lint. Run a lighthouse performance test, follow the optimisation reccomendations.

Run static analysis e.g. lint with lockfile-lint, Stylelint, ESLint, check for unimported files using unimported, and identify potential security vulnerabilities

Stylelint

The complete code for this project is in the Rodney Lab GitHub repo. I do hope the post has either helped you with an existing project or provided some inspiration for a new one. As an extension, you can add all your favourite future CSS rules to the PostCSS config. Beyond PostCSS for linting your input CSS, consider trying stylelint.

Stylelint helps prevent errors and ensures style conventions.

After installation, it will generate a lefthook.yml file which can be customized to perform a static code analysis before committing the code. For example, it can ensure that the git commit follows the git-conventional-commits, and use Prettier, ESLint, and Stylelint to check, format, and fix any file which will be committed and run any test related with Vitest depending on the filetype and run each in parallel.

We might also call stylelint so we can lint our source CSS.

No formatting inconsistencies: The committed code should follow the organization's code formatting standards(prettier or pretty-quick).

Let’s walk through the steps for a one-time setup to configure husky pre-commit and pre-push hooks, ESLint with code styles conventions, prettier code formatter, and lint-staged. Husky automatically runs a script on each commit or push. This is useful for linting files to enforce code styles that keeps the entire code base following conventions.

GitHub | Website

Prettier: An opinionated code formatter that enforces a consistent code style.

What is Prettier 😎?

In this Thread, I won't show you little extensions that you probably already know, like Live Server or Prettier.

1.1k isn't bad for a project with ~33 million weekly downloads[1], imo. Yes, I know that's not necessarily a good metric, but it's ~10 million more than React[2] which also has a similar number of open issues[3].

[1]: https://www.npmjs.com/package/prettier

[2]: https://www.npmjs.com/package/react

[3]: https://github.com/facebook/react

Actually that comment derives onto this other issue, where the merits of the decision are discussed:

https://github.com/prettier/prettier/issues/15956

and to be honest, it didn't look like silly to me :) It was an interesting read for me, who as a maintainer, I tend to give more importance to the official statements such as in this case written recommendations of the source company that defined the new format.

https://github.com/prettier/prettier/issues/15942#issuecomme...

Another example: https://github.com/prettier/prettier/issues/187

That issue has been open for 7 years.