Feature Request: Specify style default lang

[blake-newman]

• I have searched through existing issues
• I have read through docs at https://vuejs.github.io/vetur/
• I have read FAQ: https://github.com/vuejs/vetur/wiki/FAQ

Problem

SFC by default uses postcss, thus you don't need to specify <style lang="postcss"> when using cssnext/postcss ect. However to get correct highlighting with Vetur the default is css.

Solution

Add vscode option to specify the default style lang, to change to postcss.

vetur.format.styleDefaultLang

[octref]

SFC by default uses postcss

That's something I'm unaware of...Is it a template-specific config? Is there anyway to make that template specify postcss like <style lang="postcss">?

vetur.format.styleDefaultLang

We'll likely add something like

"vetur.grammar.css": "postcss",
"vetur.grammar.customBlocks": {
  "i18n": "yaml"
}

for #210.

[blake-newman]

You can, but I think practically it's more extensible if you can specify grammars. It also requires less configuration for applications.

Also by using internals of Vue-loader, you know the built-in features, and new feature 'Just work ™'

[evanyangg]

@octref hey, I don't know if it's the same question.

*.css file , cssnext grammar , and Postcss language mode , it's worked.
but. in *.vue file i had error message when i set lang = "css" (lang="postcss" it's ok)

[robwierzbowski]

@evanyangg Yes, I think that's expected. If you set lang=css, the styles will be linted against the CSS spec. Just plain old CSS.

CSS Next is built with PostCSS, and adds many features that aren't currently implemented by browsers. They may be implemented in the future though :). So for now, nesting and some other features of CSS Next will give errors for lang=css, but not for lang=postcss.

[robwierzbowski]

Re: the original issue, 👍 to making PostCSS the default style language. Ideally the linter would read the PostCSS config and lint for just the plugins that have been installed 🙂.

[sylvinus]

We are defaulting to SASS for <style> and would love to be able to configure it in vetur!

[HerringtonDarkholme]

I would say no to this feature.

We already have a lot of configurations spreading across various .rc files and vscode config. It is hard for users to learn where to config what. Also, postcss doesn't necessarily mean CSSNext. And CSSNext actually contains many rejected proposals.

An explicit lang="postcss" in vue file doesn't require configuration and it does signal users what syntax should be written.

[blake-newman]

The issue is solved with explicitness with vue-loader. <style lang="postcss/pcss/sugarcss/sss">

[dcrystalj]

@HerringtonDarkholme Why do I have to set lang explicitly in every component if I use postcss across all components anyway ?