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

Build: Rebuild package stylesheet entrypoints for file updates #15920

Merged
merged 1 commit into from
May 31, 2019

Conversation

aduth
Copy link
Member

@aduth aduth commented May 30, 2019

Regression introduced in #15230

This pull request seeks to resolve an issue with the revised build implementation merged in #15230 . Stylesheet rebuilds are always intended to compile from the entrypoints, not from the individual files which have been updated. This is distinct from JavaScript files, which are built individually and which rely on Webpack to manage entrypoint bundling.

Implementation Notes:

Since this was already stream-based, I implemented the fix using a stream transform to map the files modified to the equivalent entrypoints.

Testing Instructions:

Run the command:

npm run clean:packages && node ./bin/packages/build.js packages/block-library/src/columns/editor.scss packages/block-library/src/columns/style.scss packages/block-library/src/columns/edit.js

Verify at ./packages/block-library:

  • build includes columns/edit.js and columns/edit.js.map
  • build-style includes editor.css, style.css, theme.css (and RTL counterparts)

The fix is specifically in the latter point. Previously, the build script would output the compiled CSS at build-style/columns/editor.css and build-style/columns/style.css. The former point is merely to assure there is no effect on JavaScript build.

@aduth aduth added [Type] Bug An existing feature does not function as intended [Type] Build Tooling Issues or PRs related to build tooling labels May 30, 2019
return new Transform( {
objectMode: true,
async transform( file, encoding, callback ) {
// Only stylesheets are subject to this transform.
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I thought to be clever / functional here with some sort of conditional flow (an overEvery and/or series Promise) but I couldn't come up with an implementation which wouldn't end up being unnecessarily obscure / unreadable.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Best to keep it simple! 😀

Copy link
Member

@noisysocks noisysocks left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tested this by following your instructions and by making a few CSS changes while running npm run dev. Took me a little while to grok how stream transforms work but got there in the end 👍

@gziolo gziolo added this to the 5.9 (Gutenberg) milestone May 31, 2019
@gziolo
Copy link
Member

gziolo commented May 31, 2019

I better merge it to ensure npm run dev works seamlessly. I trust you both :)

@gziolo gziolo merged commit 7cb7c50 into master May 31, 2019
@gziolo gziolo deleted the fix/rebuild-scss branch May 31, 2019 06:05
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Type] Bug An existing feature does not function as intended [Type] Build Tooling Issues or PRs related to build tooling
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants