Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>Index File ManagerNew to Visual Studio Code? Get it now.
Index File Manager

Index File Manager

Mario Studio

|
190 installs
| (0) | Free
A VSCode extension that improves the management of index.js, index.ts, index.jsx, and index.tsx files by displaying their parent folder names and offering a rename command, as well as providing a vice versa rename command to convert a normal file to an index file under a folder named after the origi
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Index File Manager VSCode Extension

This extension is a handy tool for managing index files in Visual Studio Code.

Why the Name Change?

Originally, this extension was named Folder For Index because its primary purpose was to display the folder information of the index file in the notification to avoid confusion when multiple index files were opened. However, with the availability of the workbench.editor.customLabels setting in VS Code, which allows displaying the folder name in the editor label, this feature became redundant. Consequently, the feature was removed, and new functionalities described below were added. To better reflect these new functionalities, the extension was renamed to Index File Manager.

Features

File Rename Command

The Index File Manager extension offers a rename command that allows you to rename a selected supported index.<extension> file to use its parent folder's name while keeping the same extension. Supported extensions are configured with indexFileManager.fileExtensions. For instance, file src/components/Button/index.jsx can be renamed to src/components/Button.jsx using this command.

Vice versa, it also provides a rename command to rename a file of normal filename to an index file under the folder named after the file. For instance, file src/components/Button.jsx can be renamed to src/components/Button/index.jsx using this command.

Create Index File Command

The Index File Manager extension provides a command to create an index file in a specified folder. This command scans files matching the configured extensions and generates an index file that exports all the members(*) from all the found files.

Usage

Rename File

To use the Rename Index File command, follow these steps:

  1. Right-click on a file whose extension is enabled in indexFileManager.fileExtensions in the VSCode file explorer.
  2. In the context menu, find the Rename Index File option and click on it.
  3. Your file will now be renamed.
  4. If prompted to update imports, please select Yes or Always.

Create Index File

  1. Right-click on a folder in the VSCode file explorer.
  2. In the context menu, select Create Index File....
  3. Select one of the extensions configured in indexFileManager.fileExtensions for the index file.
  4. Review the read-only native diff editor, which shows the existing and generated index file content side by side.
  5. Select Create or Overwrite in the diff editor title bar to write the generated index file, or Cancel to close the preview without writing.

Configuration

Configure Index File Manager in VS Code settings to control the files scanned when creating an index file and the generated export statements.

Setting Default Description
indexFileManager.fileExtensions js, ts, jsx, tsx File extensions managed by rename operations and included in index generation. Extensions are written without a leading dot.
indexFileManager.recursive false Includes matching files in subdirectories.
indexFileManager.exclude **/node_modules/**, **/.git/**, **/*.d.ts Glob patterns excluded from index generation.
indexFileManager.includeTestFiles false Includes files whose name contains test or spec.
indexFileManager.exportFormat exportAll Uses export * statements. Select defaultAlias to generate named aliases for default exports.

For example:

{
  "indexFileManager.fileExtensions": ["ts", "tsx", "mjs"],
  "indexFileManager.recursive": true,
  "indexFileManager.exclude": ["**/node_modules/**", "**/*.test.ts"],
  "indexFileManager.includeTestFiles": false,
  "indexFileManager.exportFormat": "defaultAlias"
}

Installation

To install the extension, search for Index File Manager in the VSCode Extensions Marketplace and click Install.

Deactivation

You can deactivate the extension by disabling it in the VSCode Extensions panel.

Supported File Types

Index File Manager manages the extensions configured in indexFileManager.fileExtensions. The default configuration is JavaScript (js), TypeScript (ts), JavaScript React (jsx), and TypeScript React (tsx).

Contribution

See contribution.md for development setup, validation, and pull request guidance.

License

MIT

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
  • Your Privacy Choices
  • Consumer Health Privacy
© 2026 Microsoft