Jamesking56
Jamesking56

Reputation: 3901

Is it possible to remove unused imports with Prettier?

I have an Expo React Native app that has a ton of unused imports in components.

I have Prettier setup for code formatting, is it possible to configure Prettier to also remove any unused imports across the project?

I can't see anything in the docs and I don't know if there is a way to add extra eslint plugins to Prettier.

Upvotes: 31

Views: 40644

Answers (5)

Zhenya
Zhenya

Reputation: 11

works with yarn

As @QuickSort mentioned, you can use prettier-plugin-organize-imports. Install plugin, add this to your .prettierrc.cjs file:

module.exports = {
    plugins: [require.resolve('prettier-plugin-organize-imports')]
};

and run prettier.

Upvotes: 0

BryceLarkin
BryceLarkin

Reputation: 504

Building off what @QuickSort mentioned above, this is what we did using the Prettier sdk:

prettier.format(text, {
    plugins: ['prettier-plugin-organize-imports']
  })

Upvotes: 0

Rasla
Rasla

Reputation: 141

 "editor.codeActionsOnSave": {
    "source.organizeImports": "always",
    "source.fixAll": "explicit"
  },

You need to add these lines in your settings.json

Upvotes: 3

Googlian
Googlian

Reputation: 6743

You can use VS Code .vscode/settings.json to organize imports.

"editor.formatOnSave": true,
"editor.codeActionsOnSave": {
  "source.organizeImports": true
}

Upvotes: 43

QuickSort
QuickSort

Reputation: 664

I don't think this is supported by default.

But you can use this prettier-plugin https://www.npmjs.com/package/prettier-plugin-organize-imports

Upvotes: 24

Related Questions