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

Duplicated css module file when using @value ... from ... inside <style module> block #1199

Closed
fnlctrl opened this issue Mar 21, 2018 · 1 comment

Comments

@fnlctrl
Copy link
Member

fnlctrl commented Mar 21, 2018

Version

14.2.1
Webpack 4.1.1

Reproduction link

https://github.com/fnlctrl/vue-loader-duplicate-cssm-import-repro

Steps to reproduce

  1. npm install

  2. npm run build
    Check dist/bundle.js, using js imported style works fine, colors.css is not duplicated`

  3. Uncomment the @value Red-500 from './colors.css'; line in app.vue, and npm run build
    Check dist/bundle.js, you'll now see colors.css duplicated.
    This bug causes colors.css to be duplicated every time a component
    uses @value ... from ... inside <style module> block

What is expected?

Only one colors.css

What is actually happening?

Duplicated colors.css

@yyx990803
Copy link
Member

The root cause of this is that css-loader appends the importing module's inline loader request prefixes to all imported modules. So for import 'css-loader?foo!colors.css' and import 'css-loader?bar!colors.css', any files imported by colors.css will be duplicated because technically they might need to be processed with different options.

This is unfortunately unfixable in v14. But I managed to get it resolved in v15.

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

No branches or pull requests

2 participants