Skip to content

Make sure that imported css files in SFCs are autoprefixed, too #1053

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

Merged
merged 3 commits into from
Nov 14, 2017

Conversation

LinusBorg
Copy link
Contributor

When using postcss-loader, we have to adjust the importLoaders setting in css-loader to re-apply the previous loaders on imported files.

Without this setting, imports in css files will be read as plain css instead of being re-run through postcss, which I think is undesirable.

This is my first, untested attempt.

If any postcss(-loader) guru can chime in, help is welcome.

When using postcss-loader, we have to adjust the `importLoaders` setting in css-loader to re-apply the previous loaders on imported files.

Without this setting, imports in css files will be read as plain css instead of being re-run through postcss, which I think is undesirable.

This is my first, untested attempt.

If any postcss(-loader) guru can chime in, help is welcome.
@@ -31,6 +34,10 @@ exports.cssLoaders = function (options) {

// generate loader string to be used with extract text plugin
function generateLoaders (loader, loaderOptions) {
let importLoaders = 0
if (options.usePostCSS) importLoaders++
if (options.usePostCSS && loader) importLoaders++
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

actually I think we don't need this since preprocessors (SASS, LESS, Stylus) will handle @import themselves, so there won't be any left for css-loader to care about.

const importLoaders = options.usePostCSS && !loader ? 1 : 0

that should be enough.

This works for all combinations - imports in .js, imports in .vue, nested imports in .css
@LinusBorg LinusBorg changed the title [WIP] add importLoaders to css-loader Make sure that imported css files in SFCs are autoprefixed, too Nov 14, 2017
@LinusBorg LinusBorg merged commit cc53d3e into develop Nov 14, 2017
@LinusBorg LinusBorg deleted the adjust-postcss-config branch November 14, 2017 20:13
c0defre4k added a commit to neonblack-at/webpack that referenced this pull request Nov 17, 2017
* vuejs-templates/master: (54 commits)
  v1.2.3
  remove double FriendlyErrorsPlugin (fix vuejs-templates#1064)
  v 1.2.2
  remove unnecessary minimize option (close vuejs-templates#1056)
  Make sure that imported css files in SFCs are autoprefixed, too (vuejs-templates#1053)
  reduce clientLogLevel
  remove `express` from package.json (vuejs-templates#1060)
  Remove extra commas (vuejs-templates#1050)
  1.2.1 - Bugfix release (vuejs-templates#1052)
  bumb version string in config in package.json
  bumb version string in config
  re-add postcss-loader
  Fix typos and formatting (vuejs-templates#1048)
  fix(jest): fix Jest coverage directory (vuejs-templates#1046)
  Remove unnecessary whitespaces (vuejs-templates#1047)
  re-merge (vuejs-templates#1045)
  Set ExtractTextPlugin.allChunks to true (vuejs-templates#1027)
  pass cssSourceMap option to vue-loader (vuejs-templates#756)
  Grammar and typo fixes on docs (vuejs-templates#992)
  Use webpack 3's standard way to generate a manifest in CommonsChunkPlugin (vuejs-templates#1028)
  ...

# Conflicts:
#	meta.js
#	template/config/index.js
#	template/index.html
#	template/package.json
frandiox pushed a commit to OnsenUI/vue-cordova-webpack that referenced this pull request Dec 25, 2017
shenron pushed a commit to shenron/webpack that referenced this pull request Mar 20, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant