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

feat: add rollup option to export styles #453

Merged
merged 8 commits into from Jul 18, 2018

Conversation

Projects
None yet
4 participants
@morewry
Copy link
Contributor

commented Jul 16, 2018

See #451 for more information.

This pull request adds a styleExport option to modular-css-rollup that will add an additional ES Module export of each CSS Module's styles for CSS-in-JS approaches that may need the style contents instead of or in addition to class names and values.

One specific example is gaining true style scoping by using Shadow DOM where only styles within the shadow tree will apply to the elements in the shadow tree. Making the styles available in scripts allows a developer to embed the styles as a templated part of each Web Component instance.

@codecov

This comment has been minimized.

Copy link

commented Jul 16, 2018

Codecov Report

Merging #453 into master will increase coverage by 0.01%.
The diff coverage is 100%.

Impacted file tree graph

@@            Coverage Diff             @@
##           master     #453      +/-   ##
==========================================
+ Coverage      99%   99.01%   +0.01%     
==========================================
  Files          31       31              
  Lines         800      810      +10     
  Branches      124      128       +4     
==========================================
+ Hits          792      802      +10     
  Misses          8        8
Impacted Files Coverage Δ
packages/rollup/rollup.js 98.86% <100%> (+0.12%) ⬆️
packages/core/processor.js 100% <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 8b0f377...6bf5961. Read the comment docs.

@tivac

This comment has been minimized.

Copy link
Owner

commented Jul 17, 2018

On my phone but this looks like a good start! I'll investigate the source map issue a bit, hopefully it's straightforward.

@morewry

This comment has been minimized.

Copy link
Contributor Author

commented Jul 17, 2018

If the configuration map: false is used in tandem, the source map is suppressed, if map: { inline: false }, it's made external. It'd be easy to clean the snapshot up by doing one or the other, but I didn't want to muddy what the test was really testing. And it illustrates the potential gotcha: you should probably not use the same configurations re: source maps for dev and production builds.

Depending on how far you want to go with protecting users from their own mistakes, I think an implementation solution could lie in conditional defaults. Meaning, e.g. if options.styleExport then options.map.inline = false--unless the user has otherwise specified.

tivac added some commits Jul 17, 2018

chore: 📦 updates
- postcss@7.0.0
- dependency-graph@0.7.1
chore: 📦 updates
- cssnano@4.0.2
- jest@23.4.1
- jest-cli@23.4.1
- svelte@2.9.4
- webpack@4.16.1
chore: 📦 update
- postcss@7.0.0
chore: install children automatically
Also a bunch of 🔒 updates
@tivac

This comment has been minimized.

Copy link
Owner

commented Jul 17, 2018

Yeah, if you define styleExport it should:

  • Disable emitting CSS files to disk
  • Disable usage of done
  • Disable source maps unless explicitly set

Because none of those really make sense in this context.

tivac added some commits Jul 18, 2018

fix: styleExport mode side-effects
- Disables source maps if they aren't explicitly requested
- Disables file emitting
- Warns if using done hook since it'll never be called
@tivac

This comment has been minimized.

Copy link
Owner

commented Jul 18, 2018

Ugh, sorry. Screwed up by accidentally merging master into your pr branch. It should still land fine, the history in this PR is just uglier than necessary. Gonna see if I can fix it...

@tivac tivac merged commit f0d4e43 into tivac:master Jul 18, 2018

1 check was pending

continuous-integration/travis-ci/pr The Travis CI build is in progress
Details
@TravisBuddy

This comment has been minimized.

Copy link

commented Jul 18, 2018

Hey @morewry,
Something went wrong with the build.

TravisCI finished with status errored, which means the build failed because of something unrelated to the tests, such as a problem with a dependency or the build process itself.

@morewry

This comment has been minimized.

Copy link
Contributor Author

commented Jul 20, 2018

FYI, I have on my list to iterate on the rest of the behavior changes within the next few days.

@tivac

This comment has been minimized.

Copy link
Owner

commented Jul 20, 2018

@morewry I added all the ones mentioned in #453 (comment) in commit 4b67b7b, are there others?

@morewry

This comment has been minimized.

Copy link
Contributor Author

commented Jul 20, 2018

Oh! I missed that! Awesome, no, that looks like everything. Thank you so much!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.