Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/neoki07/prettier-plugin-astro-organize-imports
A Prettier plugin for formatting imports in Astro files
https://github.com/neoki07/prettier-plugin-astro-organize-imports
astro formatter plugin prettier sort-imports
Last synced: 13 days ago
JSON representation
A Prettier plugin for formatting imports in Astro files
- Host: GitHub
- URL: https://github.com/neoki07/prettier-plugin-astro-organize-imports
- Owner: neoki07
- License: mit
- Created: 2023-06-24T17:59:49.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-06-15T15:53:35.000Z (5 months ago)
- Last Synced: 2024-06-15T17:12:25.260Z (5 months ago)
- Topics: astro, formatter, plugin, prettier, sort-imports
- Language: TypeScript
- Homepage: https://www.npmjs.com/package/prettier-plugin-astro-organize-imports
- Size: 1.59 MB
- Stars: 30
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# [Prettier](https://prettier.io/) Plugin: Organize Imports for [Astro](https://astro.build/)
[](https://github.com/neoki07/prettier-plugin-astro-organize-imports/blob/main/LICENSE)
[](https://www.npmjs.com/package/prettier-plugin-astro-organize-imports)
[](https://www.npmjs.com/package/prettier-plugin-astro-organize-imports)
[](https://github.com/neoki07/prettier-plugin-astro-organize-imports/actions/workflows/ci.yml)
A plugin that makes Prettier organize your imports (i. e. sorts, combines and removes unused ones) in Astro files using the `organizeImports` feature of the TypeScript language service API.
## Installation
```shell
npm install -D prettier prettier-plugin-astro-organize-imports
```
### Recommended configuration
```json5
// .prettierrc
{
"plugins": ["prettier-plugin-astro-organize-imports"],
"overrides": [
{
"files": "*.astro",
"options": {
"parser": "astro"
}
}
]
}
```
## Usage
After following the steps in the 'Installation' section, the plugin will function when you run the Prettier formatting command.
Files containing the substring `// organize-imports-ignore` or `// tslint:disable:ordered-imports` will be skipped and won't be processed by this plugin.
The plugin provides an option named `astroOrganizeImportsMode` that lets you choose the mode of formatting. The available options are:
- `All`: This is the default option. It removes unused imports, coalesces imports from the same module, and sorts imports.
- `SortAndCombine`: This option coalesces imports from the same module and sorts imports.
- `RemoveUnused`: This option removes the unused imports.
You can specify the mode in your Prettier configuration file as follows:
```json5
// .prettierrc
{
// ..
"astroOrganizeImportsMode": "All" // or "SortAndCombine" or "RemoveUnused"
}
```
Remember to replace "All" with "SortAndCombine" or "RemoveUnused" depending on your preferences.
## Compatibility with other Prettier plugins
This plugin uses Prettier APIs that can only be used by one plugin at a time, making it incompatible with other Prettier plugins implemented the same way. To solve this we've added explicit per-plugin workarounds that enable compatibility with the following Prettier plugins:
- `prettier-plugin-astro`
- `prettier-plugin-tailwindcss`
One limitation with this approach is that `prettier-plugin-astro-organize-imports` must be loaded last. You can do this by listing each of your Prettier plugins in the `plugins` array:
```json5
// .prettierrc
{
// ..
"plugins": [
"prettier-plugin-astro",
"prettier-plugin-tailwindcss",
"prettier-plugin-astro-organize-imports" // MUST come last
],
"overrides": [
{
"files": "*.astro",
"options": {
"parser": "astro"
}
}
]
}
```
## Related Prettier plugins
This plugin is heavily inspired by following plugins:
- [prettier-plugin-organize-imports](https://github.com/simonhaenisch/prettier-plugin-organize-imports)
And, for implementation reference, the following plugins:
- [prettier-plugin-astro](https://github.com/withastro/prettier-plugin-astro)
- [prettier-plugin-tailwindcss](https://github.com/tailwindlabs/prettier-plugin-tailwindcss)