Can you customize code folding?

Question

Is it possible to customize the way code folding works in Visual Studio Code?

I use a common pattern of defining regions of code across a variety of different document types.

So, for XML I wrap sections of text with  and 
For c#, I use #region to #endregion,
For TypeScript/Javascript, I use /* #region */ and /* #endregion */.

In full Visual Studio (not VS Code), I have a custom extension which snoops for the pattern across document types, and creates folds based on that, allowing me to create neat, custom document outlines. I'd like to use the same pattern in Visual Studio Code. Is it possible to create a custom VS Code extension which detects these comment patterns, and somehow tags folds based on the patterns?

score 9 · Accepted Answer · edited Dec 26 '18 at 19:48

FoldingRangeProvider can be used if you are looking to contribute custom folding logic in an extension.

Be sure to set your VS Code version in engines in package.json to 1.23, the version that introduced this.

Here's how you'd use one.

export function activate(context: ExtensionContext) {
    languages.registerFoldingRangeProvider({ scheme: 'file', language: 'markdown' }, new MyFoldingRangeProvider());
}

class MyFoldingRangeProvider implements FoldingRangeProvider {
    provideFoldingRanges(document: TextDocument, context: FoldingContext, token: CancellationToken): FoldingRange[] {
        return detectRanges().map(({ lineStart, lineEnd }) => new FoldingRange(lineStart, lineEnd));
    }
}

score 2 · Answer 2 · answered Jun 08 '16 at 14:53

2

Unfortunately, not at the moment. There is a an open issue in github for this very topic.

answered Jun 08 '16 at 14:53

seairth

1,798
13
22

score 2 · Answer 3 · edited Oct 09 '21 at 11:20

2

There are three ways to achieve customized folding in a VSCode extension.

You can define regex as folding markers in a [language-name].configuration.json file. (However, we don't have much customization with this approach)

{
  "folding": {
    "markers": {
      "start": "starting regex",
      "end": "ending regex"
    }
  }
}

You can define a FoldingRangeProvider from within the extension as described in this answer. FoldingRange in vscode package supports folding customization with startLine, endLine, and foldingKind.
You can use Language Server support with textDocument/foldingRange. FoldingRange in the vscode-languageserver-protocol supports folding customization with startLine, endLine, startCharacter, endCharacter, and foldingKind.

Check this for more details.

edited Oct 09 '21 at 11:20

DarkTrick

1,329
1
10
24

answered Nov 19 '20 at 03:15

prabushi samarakoon

481
2
7

2

Where do I find `[language-name].configuration.json`? – René Nyffenegger Apr 29 '21 at 10:04
It is the `configuration` under `contributes.languages` defined in `package.json` of your extension code. { "contributes": { "languages": [ { "id": "language-name", "aliases": [], "extensions": [ ".abc" ], "configuration": "./grammar/language-name.configuration.json" } .... } – prabushi samarakoon May 01 '21 at 06:28

Can you customize code folding?

3 Answers3

Linked