Registry /
web-framework / prettier-plugin-imports
Install & Compatibility
Where this runs
tested against v? · npm install
Install × environment matrix
Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux
muslnode 18–226 runs
build_error
glibcnode 18–226 runs
build_error
Code
Verified usage
Verified import paths — ran on the pinned version, not inferred.
PrettierConfig
✓ import type { PrettierConfig } from 'prettier-plugin-imports';
✗ import { PrettierConfig } from 'prettier-plugin-imports'; (type only import is correct, value import is wrong)
TypeScript users should use type-only import for the config type.
PrettierConfig (usage)
✓ module.exports = /** @type {import('prettier-plugin-imports').PrettierConfig} */ ({...});
✗ None common
In JavaScript files, use JSDoc to type the config object as shown.
Plugin setup (CommonJS)
✓ module.exports = { plugins: ['prettier-plugin-imports'], ... };
✗ module.exports = { plugin: 'prettier-plugin-imports', ... }; (incorrect property name)
The plugin is loaded by name; no explicit import is needed in Prettier config.
Plugin setup (ESM)
✓ export default { plugins: ['prettier-plugin-imports'], ... };
✗ module.exports = { plugins: ['prettier-plugin-imports'], ... }; (if config is ESM)
Use ESM syntax (export default) when working with ESM Prettier config files.
Shows installation, Prettier config setup with importOrder and importOrderParsers, and a sample input/output demonstrating import sorting.
// Install: npm install -D prettier prettier-plugin-imports
// prettier.config.js
/** @type {import('prettier-plugin-imports').PrettierConfig} */
module.exports = {
printWidth: 80,
tabWidth: 2,
semi: true,
singleQuote: true,
trailingComma: 'all',
importOrder: [
'^@core/(.*)$',
'',
'^@server/(.*)$',
'^@ui/(.*)$',
'',
'^[./]'
],
importOrderParsers: ['typescript', 'jsx', 'decorators-legacy'],
importOrderTSVersion: '5.0.0'
};
// Input: 'src/index.ts'
import { logger } from '@core/logger';
import { createServer } from '@server/node';
import { Alert } from '@ui/Alert';
import { debounce } from 'lodash';
import { Message } from './Message';
import 'core-js/stable';
// Run: npx prettier --write src/index.ts
// Output will sort and group imports per importOrder, preserving side-effect order.
Errors
Common errors & fixes
Cannot find module 'prettier-plugin-imports'
The plugin is not installed or not correctly resolved.
fixEnsure package is installed: `npm install -D prettier prettier-plugin-imports`
TypeError: prettier-plugin-imports: unknown option `importOrderSeparation`
Deprecated option still present in config.
fixRemove `importOrderSeparation`; use empty strings in `importOrder` array to separate groups.
Error: prettier-plugin-imports: `importOrderParsers` must be an array of strings
The option is incorrectly set (e.g., a single string).
fixUse array format: `importOrderParsers: ['typescript', 'jsx']`
Module parse error: Unexpected token (1:0) (prettier-plugin-imports)
The `importOrderParsers` does not include a parser that matches the file type (e.g., Vue files need 'vue').
fixAdd appropriate parser to `importOrderParsers`: e.g., `'vue'` for .vue files.
Audit
Dependencies
@vue/compiler-sfcoptionalRequired for parsing Vue single-file components when used with Vue projects.
prettierrequiredPeer dependency; plugin requires Prettier version 3 or higher.