Live Reloading Frontend Asset in Development & Optimize Webpack Recompile #140
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This changes reduce slow webpack compilation when using Tailwind @apply Before this changes, it takes 10 seconds to recompile whenever change is made on application.scss According to the ref articale, Tailwind CSS's components and utilites have large file sizes, making the recompilation very slow. This workaround separate Tailwind CSS and custom @apply CSS so webpack never have to recompile the large Tailwind CSS stuff since it wasn't changed. Ref: https://rubyyagi.com/solve-slow-webpack-compilation/ Another workaround, similar idea but without using @layer: tailwindlabs/tailwindcss#443 (comment)
|
SonarCloud Quality Gate failed.
|
user512
changed the title
|
I am going to merge this so it's easier for me to work on #139 but happy to change/ revert if you see red flag. |
|
Ah, that's super interesting! I've never used |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
74f53ef provide live reload and compile frontend asset on JS / SCSS file change instead of waiting for a new request in development mode.
fbb02df optimize webpack recompile so recompile time is down to around 1 second.
Before fbb02df, making changes in any scss file that uses
@applyAfter fbb02df
Please note that initial compile will still be slow but it'll be fine because developer only run
bin/runonce.