Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature: Handle postcss file extensions if no loader options give #1055

Merged
merged 1 commit into from
Dec 15, 2017

Conversation

blake-newman
Copy link
Member

@blake-newman blake-newman commented Nov 12, 2017

= Problem

- vue-loader automatically handles postcss by default, there is many issues
around using custom postcss lang option.

- Using postcss without a lang attribute causes SFC to loose syntax
highlghting

= Solution

- Enable option to alias langs to loader settings.
- specify postcss in lang and maintain default loader configurations

Edit

If no postcss loader is provided in vue loader options then default to
vue-loader handling

This allows you to use vue internal postcss/css handling with known
postcss extensions

fixes: #942
fixes: #800
fixes: #654

@octref
Copy link
Member

octref commented Nov 12, 2017

I'm not against using postcss grammar to highlight css, so <style> by default gets postcss highlight.
However the issue is vscode-css-languageservice does not handle postcss. So autocomplete and other language features won't work.

Vue automatically handles postcss by default

I believe that's a part of Vue's specific webpack configuration in the webpack template. I don't think Vue handles postcss by default (correct me if I'm wrong).

This has been suggested before: #500
My opinion is still the same -- being explicit on lang is better than implicit.
And from Vetur side, it's much easier to build language services according to a spec instead of according to user's ever-changing webpack config.

@blake-newman
Copy link
Member Author

@octref

Yes sorry vue-loader handles postcss by default, using lang="postcss" has known issues as far as i'm aware and i have also not been able to configure it correctly (perhaps doing something wrong).

I was also against #500, this solution does not remove explicitness from the attribute. You still have to provide the lang attribute. It merely aliases a lang to another. <style lang="postcss"> with the alias set to { postcss: 'css' } will run lang postcss with vue internals.

I do believe if possible moving into the Vetur will be best approach, as far as i could work out it was not a trivial thing to implement.

On further thoughts, we should internally handle aliasing postcss to use vue-loaders internals unless overridden in loader configuration.

@blake-newman
Copy link
Member Author

I don't think adding a public API is good, as it could lead to bad implementations now thinking about it.

@blake-newman blake-newman changed the title Feature: Lang aliasing Feature: Handle postcss file extensions if no loader options give Nov 12, 2017
If no postcss loader is provided in vue loader options then default to
vue-loader handling

This allows you to use vue internal postcss/css handling with known
postcss extensions

fixes: vuejs#942
fixes: vuejs#800
fixes: vuejs#654
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
3 participants