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 generated override style #637

Closed
ulivz opened this issue Jul 8, 2018 · 4 comments
Closed

Duplicated generated override style #637

ulivz opened this issue Jul 8, 2018 · 4 comments

Comments

@ulivz
Copy link
Member

@ulivz ulivz commented Jul 8, 2018

Bug report

Version

  • v0.10.2

Steps to reproduce

  1. Create a override.styl, type:
#override {
  font-size: 100px;
}
  1. Disable optimize-css-assets-webpack-plugin.

  2. Check out the extracted CSS output:

image

override.styl will be duplicated at the front of each component's style chunk

What is expected?

override.styl SHOULD be generated only once and SHOULD be mounted at the end of the style bundle.

What is actually happening?

override.styl was generated many times

@ulivz
Copy link
Member Author

@ulivz ulivz commented Jul 8, 2018

Workaround 1

Move:

@import '~@temp/override.styl' // generated from user config

To the end of default-theme/styles/theme.styl.

Before After
1544 lines 1508 lines

This chunk was duplicated 12 times!

Though this can fix the duplicated chunk. but it's still not the ideal solution, see the following snapshot:

image

There are still some css generated behind override.styl.

@ulivz
Copy link
Member Author

@ulivz ulivz commented Jul 8, 2018

Workaround 2

Move:

@import '~@temp/override.styl' // generated from user config

To lib/app/app.js.

import '@temp/override.styl' // generated from user config
  • Output

image

  • Conclusion

If some special components (e.g. OutboundLiks, Badge) are only used in markdown content instead of imported to theme component tree, the time to import override.styl will be earlier than the time when these special components are parsed.

So it's still the ideal output.

@ulivz
Copy link
Member Author

@ulivz ulivz commented Jul 8, 2018

Workaround 3

Same to #2 but using asynchronous import:

import ('@temp/override.styl') // generated from user config
  • Output:

Wonderful, That's what we want!

image

cc @yyx990803

@ulivz
Copy link
Member Author

@ulivz ulivz commented Jul 8, 2018

Appendix

Check out the generated files at each workaround: #637.zip

├── #1.css
├── #2.css
├── #3.css
└── #before.css
@ulivz ulivz changed the title Duplicated generated override CSS Duplicated generated override style Jul 8, 2018
@ulivz ulivz closed this in f998802 Jul 8, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
1 participant