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

Fix issues with using postcss-import plugin and postcss-modules plugin #62

Merged
merged 1 commit into from
Jan 24, 2018

Conversation

jsanchez034
Copy link
Contributor

If you are using the postcss-import plugin, it requires that it be the first plugin passed to PostCSS (See first note in the postcss-import README). Currently rollup-plugin-postcss puts the postcss-modules plugin first in the list of PostCSS plugins causing an issue if you use CSS Modules composes from an external file together with @import syntax from the postcss-import plugin. The issue is the data from @import gets wiped out by the inlining done by composes from postcss-modules. Example..
Input

// shared/border-radius.css
.all {
  border-radius: 3px;
}
// shared/colors.css
:root {
  --white: #fff;
}
// main.css
@import '../shared/colors.css';

.test {
  composes: all from '../shared/border-radius.css';
  background-color: var(--white);
}

Output without this change

.border-radius_all__3XQLI {
  border-radius: 3px;
}
.main_test__2schg {
  border-color: var(--white);

Output with this change

.border-radius_all__3XQLI {
  border-radius: 3px;
}

:root {
  --white: #fff;
}

.main_test__2schg {
  border-color: var(--white);
}

This change makes it so that the postcss-modules plugin is last in the list of plugins passed to PostCSS.

@codecov
Copy link

codecov bot commented Jan 23, 2018

Codecov Report

Merging #62 into master will not change coverage.
The diff coverage is 100%.

Impacted file tree graph

@@           Coverage Diff           @@
##           master      #62   +/-   ##
=======================================
  Coverage   95.42%   95.42%           
=======================================
  Files           7        7           
  Lines         175      175           
  Branches       55       55           
=======================================
  Hits          167      167           
  Misses          8        8
Impacted Files Coverage Δ
src/postcss-loader.js 95.16% <100%> (ø) ⬆️

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 4870ff8...fe2cdc6. Read the comment docs.

@egoist egoist merged commit 0897815 into egoist:master Jan 24, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants