-
Notifications
You must be signed in to change notification settings - Fork 116
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
Duplicate imports are resolved in the wrong order #462
Comments
Sorry for the slow reply here; reproduced. However, At this point, I think our only option is to introduce an option to specify whether you want to use the first or last duplicate import. Perhaps roll |
Indeed the behaviour is different from browser's. But the browser's behaviour IMHO is not the case for the task. Since postcss-import is a tool for bundling libraries with their complex dependencies recusively in applications, the behaviour when the first occurrence of imported file is included first is desired. Browser's behaviour is to give a favour to last included CSS. If a browser meets something twice it loads it twice. That is why the behaviour of browser differs. As for me building a bundle of a project with complex dependencies is just another task, then the browser's. I believe that CSS files should be included only with the first reference because they should be coupled with the code of the library they come from. Moreover, all dependants are free to override the libraries' rules partially. This aligns with that rule, that something more specific overrides something that is more general. The most deep dependency should be included in a bundle first just because of the nature of libraries. |
This plugin uses a different import order than the browser, which can lead to visual discrepancies when CSS is bundled vs. unbundled. I believe this is a regression and that it was caused by #211. The behavior used to be correct but was broken in that change, and is now incorrect.
Here's an example (note that the file
common.css
is being imported twice):When you view
index.html
in a browser, you should see a white background and red text. However, when bundled with PostCSS, the entire page is red.Here's the script I used to bundle with PostCSS:
The incorrect behavior can be "fixed" by adding
skipDuplicates: false
to thepostcss-import
options, but that's not great because it makes the output bigger unnecessarily. This option is also dangerous becauseskipDuplicates: false
can causepostcss-import
to infinite-loop and hang if the import graph has cycles.The way to fix all of these problems and have
postcss-import
match what the browser does is to only respect the last duplicate@import
statement instead of only respecting the first duplicate@import
statement.The text was updated successfully, but these errors were encountered: