question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Plugin has a conflict with the built-in organize imports

See original GitHub issue

As soon as VScode was updated to 1.31.0, it appears that this prettier extensions conflicts with the the built-in organize imports setting, when organize imports on save is enabled.

prettier: "prettier": "^1.16.4", (was initially on 1.13.7, tried to update) vscode: Version 1.31.0 (1.31.0) extension: 1.8.0

I first opened a ticket with vscode core, but was referred to the extension as the source of the problem: https://github.com/Microsoft/vscode/issues/68193

Steps to reproduce

  1. Add setting for editor.codeActionsOnSave.source.organizeImports = true (see below for example json)
  2. Ensure prettier is configured to format on save
  3. create a ts file (may also work with js) that has an import that exceeds the configured line length, which should be turned into a multi-line import
  4. Save file

Expected behavior:

  1. imports should be organized
  2. imports should be formatted to multi-line import
  3. file should be saved

Actual behavior:

  1. imports are organized
  2. imports remain on a single line
  3. file remains “dirty” - with the little white dot in the tab-bar

Note: I can format the document manually using the command menu and the import is correctly formatted, but then on save it is unformatted and the file shows as modified by the file system.

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

Initial file

image

Format file manually, just to show that it works

image

image

After Save (cmd+s)

image

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:69
  • Comments:38 (6 by maintainers)

github_iconTop GitHub Comments

8reactions
hevans90commented, May 1, 2019

After playing with some of the VSCode settings a bit more, you can make the editor behave in a REALLY strange way:

weird_formatting_conflicts

And look at what happens if you repeatedly save the file:

image

Yep, either Prettier or VSCode’s organizeImports breaks code - looks like a race condition. I’d stay away from organizeImports for now.

8reactions
nikitavoloboevcommented, Mar 1, 2019

Can this be solved in some way? I would like to help if I can to implement this.

Read more comments on GitHub >

github_iconTop Results From Across the Web

prettier-plugin-organize-imports - npm
A plugin that makes Prettier organize your imports (i. e. sorts, combines and removes unused ones) using the organizeImports feature of the ...
Read more >
How to use tsserver's organize imports with nvim built-in LSP ...
Been doing with ALE and an eslint plugin. But I am getting hooked more on the LSP way :).
Read more >
Supported hooks - pre-commit
cheetah-reorder-imports - This hook reorders imports in cheetah files. cheetah-flake - Lint cheetah code using flake8 and some other checks.
Read more >
Sorting your imports correctly in React - DEV Community ‍ ‍
eslint-plugin-import is a plugin that extends the ESLint import rules. It doesn't have properties only to organize and to sort; also, ...
Read more >
Imports - checkstyle
Checks that there are no static import statements. Rationale: Importing static members can lead to naming conflicts between class' members. It ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found