关于VSCode 1.23版本Organize Imports功能的配置咨询

Great questions about tweaking the Organize Imports feature in VS Code v1.23! Let's walk through each of your requested configurations:

1. Sorting external libraries before local imports #

Absolutely, you can configure the import order to prioritize external libraries (like Angular or RxJS) over local files. This relies on VS Code's integration with TypeScript/JavaScript language service preferences.

Add these settings to your settings.json (accessible via Ctrl/Cmd + , then clicking the "Open Settings (JSON)" icon):

// For TypeScript projects
"typescript.preferences.importOrder": [
  "^@angular/(.*)$",
  "^rxjs/(.*)$",
  "^[./]"
],

// For JavaScript projects
"javascript.preferences.importOrder": [
  "^@angular/(.*)$",
  "^rxjs/(.*)$",
  "^[./]"
]

The regex patterns here match external library imports first, then local relative imports. Adjust the patterns to match your specific external dependencies as needed.

2. Adding line breaks between import groups #

Yes, you can add blank lines between different import sources using the same importOrder setting. Just insert an empty string between the groups you want to separate:

"typescript.preferences.importOrder": [
  "^@angular/(.*)$",
  "^rxjs/(.*)$",
  "", // This adds a blank line between external and local imports
  "^[./]"
]

This will create a clear visual separation between your external library imports and local file imports.

3. Making Organize Imports respect maximum line length #

The core Organize Imports feature focuses on sorting and removing unused imports—it doesn't handle line wrapping on its own. However, you can combine it with VS Code's formatting settings to enforce your project's maximum line length for imports.

Here's how to set it up:

1. Ensure you're using the built-in TypeScript/JavaScript formatter by setting:

   "[typescript]": {
     "editor.defaultFormatter": "vscode.typescript-language-features"
   },
   "[javascript]": {
     "editor.defaultFormatter": "vscode.typescript-language-features"
   }
   

2. Define your maximum line length in the formatter settings:

   "typescript.formatting.wrapLineLength": 80, // Match your project's max line length
   "javascript.formatting.wrapLineLength": 80
   

3. Enable both Organize Imports and formatting on save to ensure everything works together:

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

Now, when you save a file, Organize Imports will sort your imports first, then the formatter will wrap any long import lines to match your project's line length limit.

内容的提问来源于stack exchange，提问作者Felipe Issa