Bug: Pug in brackets turned into multi line

[Christilut]

Info

Using VSCode with vetur in .vue files.

Input

p Click #[a.link(href='https://www.example.com' rel='noreferrer' target='_blank') here] to go somewhere

Output or Error

    p Click #[a.link(
      href='https://www.example.com'
      rel='noreferrer'
      target='_blank') here] to go somewhere

This gives a webpack build error:

  > 23|     p Click #[a.link(
-----------------------------^
    24|       href='https://www.example.com'
    25|       rel='noreferrer'
    26|       target='_blank') here] to go somewhere

The end of the string reached with no closing bracket ) found.

Expected Output

Maybe everything between #[ ] should remain on the same line?

[Shinigami92]

I'm currently working on another feature request so hopefully I can work on this over the weekend

[Christilut]

Awesome! :)

[Shinigami92]

Uhm... I defined a test and it just pass, without anything done 🤔
Could you have a look? Maybe I test something wrong
Also could you check your version? Maybe it's outdated and just fixed in a later version?!

[Shinigami92]

Oh... maybe it's a vetur problem? 🤔
You could subscribe to: vuejs/vetur#2014
But I don't think that this is the problem 🤔

[Christilut]

I think that's a different problem because the formatter does work here.

This is what I'm using:

    "pug": "2.0.4",
    "pug-plain-loader": "^1.0.0",
    "eslint": "6.8.0",
    "eslint-config-standard": "^14.1.0",
    "eslint-plugin-import": "2.20.1",
    "eslint-plugin-node": "11.0.0",
    "eslint-plugin-promise": "^4.2.1",
    "eslint-plugin-standard": "^4.0.1",
    "eslint-plugin-vue": "6.2.1",

in vscode:
    vetur 0.27.3
    puglint 2.3.0

[Shinigami92]

So do I understand correctly that you have not installed plugin-pug locally in your devDependencies and therefore a fallback is performed for the Vetur's plugin-pug?

https://github.com/vuejs/vetur/blob/e68b119804717106b85447091b64ad2eb14dc039/server/package.json#L24

Maybe you need to add vls to you devDependencies?

Don't forget to clean node_modules and maybe reload vscode after clean install of npm/yarn

[Christilut]

Yes I guess so. I don't really know what vscode plugins do internally.

The formatting works, but only the #[ ] tags are formatted wrong. So I'm not sure how the vue language server relates to that?

[Shinigami92]

I possibly thought it could be something like a version missmatch.

You should try to format via prettier cli and look if it's the same problem when using the cli
Cause my tests passes and don't format something like this
Please give me something reproducible without vetur in the way
Otherwise I think it's a vetur related issue and you should open an issue there

[Christilut]

Okay, I'll do that. Thanks!