prettier-plugin-sort-imports VS biome

In a similar vein, you can sort imports with Prettier using Trivago’s plugin.

https://github.com/trivago/prettier-plugin-sort-imports

I went with my configuration you can go with one you like more. Find out more by clicking here

For most conventions regarding file structure, I would use tools like ESLint / Prettier instead of trying to enforce it with comments. For example this Prettier plugin allows you to enforce a specific import order without any extra effort.

Unsorted imports look ugly. Also, it could be hard to read and add new imports. So why not sort them automatically? We can do it with trivago/prettier-plugin-sort-imports.

Your suggestion to sort imports is valid, but depends on VSCode as an IDE. It would be better to use Prettier with this plugin that sorts imports for you.

Despite the existence of Prettier, arguments about code style such as how to sort ES module imports still exist. Manually sorting ES modules wastes time, and usually leads to losing context when you are writing code and then have to navigate to the top of a file to modify your import statements. I love using the @trivago/prettier-plugin-sort-imports plugin which automatically sorts new imports, and works perfectly together with TypeScript's auto-import feature. Similarly, prettier-plugin-tailwindcss automatically sorts Tailwind classes in your code.

If you are using prettier, you can use https://github.com/trivago/prettier-plugin-sort-imports

In this GitHub repo, you can find a list of the other rules that are available.

For imports I like to use https://github.com/trivago/prettier-plugin-sort-imports so I don't have to think about it. Also, I think it's cleaner to have an index in your components folder that exports all of the named functions do you can import them into your files like:

{ "$schema": "https://biomejs.dev/schemas/1.7.0/schema.json", "organizeImports": { "enabled": true }, "files": { "ignore": ["package.json", "package-lock.json"] }, "linter": { "enabled": true, "rules": { "recommended": true, "style": { "noUnusedTemplateLiteral": "off" } } }, "formatter": { "indentStyle": "space", "indentWidth": 4, "lineWidth": 320 }, "javascript": { "formatter": { "semicolons": "asNeeded" } } }

It is great to see that so many users are enthusiastic about Biome. It is really gratifying to work on a project that is appreciated and useful to the community.

[0] https://biomejs.dev/

Once you build a simple Vite backend integration, try not to complicate Vite's configuration unless you absolutely must. Vite has become one of the most popular bundlers in the frontend space, but it wasn't the first and it certainly won't be the last. In my 7 years of building for the web, I've used Grunt, Gulp, Webpack, esbuild, and Parcel. Snowpack and Rome came-and-went before I ever had a chance to try them. Bun is vying for the spot of The New Hotness in bundling, Rome has been forked into Biome, and Vercel is building a Rust-based Webpack alternative.

> My only bad experience with prettier, besides the incredible slowness (orders of magnitude slower than ruff)

Ruff is based on the same foundations that Biome (https://biomejs.dev/). Although Biome doesn't support all languages that Prettier supports, you should give a try, it is fast.

I am also confused by this goal, I've started a discussion in the repo to get some clarity on intent and direction there: https://github.com/biomejs/biome/discussions/1642

Biome [0], a fast Prettier-compatible formatter, is currently working on adding class sorting [1]. We expect to ship the feature with the next release (on February). We are discussing which options to provide for the feature (mainly on the Discord of Biome).

[0] https://biomejs.dev/