Custom folding in Vue files.

[oxk4r01]

Hi. I'm triying to fold custom regions in vue files, and have this setup:

"explicitFolding.wilcardExclusions": [
    "vue"
  ],
  "explicitFolding.rules": {
    "*": {
      "begin": "//b/",
      "end": "//e/"
    }
  }

And then in the editor:

<script>
//b/
import HelloWorld from '@/components/00HelloWorld.vue'
//e/
...

But I'm not getting the supposed folding icon. Can you help me with this, please? (I'm using Vetur). Regards.

[daiyam]

try:

"[vue]": {
  "explicitFolding.rules": [
    {
      "begin": "//b/",
      "end": "//e/",
    },
  ]
},

[oxk4r01]

There was another [vue] entry in the json, and I had to put that inside it to avoid duplicates. I did it like that, but doesn't work :(

[daiyam]

You can test 3 things:

• check if the Langage Mode is Vue (on the bottom right of the editor)
• check if you have the setting "editor.showFoldingControls": "always"
• add the setting "explicitFolding.debug": true inside [vue] and paste the logs here

[oxk4r01]

"Show folding controls" was already set up to "always".

In the other hand, setting added, but I'm not getting any Folding channel:

[oxk4r01]

Hey, I find it. This was the problem:

If "folding strategy" is setup to "indentation", the extension doesn't work. When it's in "auto", the extension panel shows up in the output and the extension works as expected.

[daiyam]

Ok, good! I didn't think of that.

[daiyam]

I'm closing the issue since it has been fixed :wink: