Replace gulp build with wp-scripts.
Description of the Change
Replace gulp and various config files with @wordpress/scripts.
I think this is ready for review, it should probably get double sign-off as it is quite large. I recommend reviewing this with whitespace suppressed.
I have put together a second webpack config for the npm run release command as I think it is needed to copy files in to the release subdirectory for committing to the stable branch. As noted inline, I would love an alternative suggestion as it doesn't seem ideal.
Closes #892.
How to test the Change
- Ensure production file names remain the same
- Test the various builds/npm scripts have effectively the same result (ignoring whitespace, variable munging differences)
Changelog Entry
Changed - Build process now uses
@wordpress/scriptsin place of Gulp.
Credits
Props @peterwilsoncc
Checklist:
- [x] I agree to follow this project's Code of Conduct.
- [ ] I have updated the documentation accordingly.
- [ ] I have added tests to cover my change.
- [x] All new and existing tests pass.
I think I've addressed the various issues @dinhtungdu picked up:
- fc21fd1b799e5f353f7cdf96409873e64b6ff656 fixes the block editor -- the svg needs to be a react component now
- 104ba2322578d4ddb686cefd411db667af3f3437 fixes the name of the CSS file restoring
admin-pull-table.min.css - 4cd3fc8bd40b96ad68771bba58fc7d2dbb933fa8 fixes the external connections screen
WP Scripts doesn't seem to produce code compatible with older versions of WP so I've pulled in 04a15803c6bc6e775025a39122579dbcf441321e from the requirements bump PR as both the version bump and this issue are on the same milestone.
@peterwilsoncc Thanks for the updates! I can confirm all issues I noted are addressed.
I did another round of testing and found some additional issues, please check the screenshots below for more detail.
Screenshots
Distributor panel restored in 0b53814306ae663dca9d50e6b30ad5484d6eb28c -- I'd reversed a media query.
For the checked attribute showing, I think that's expected due to the differences between properties and attributes.
The property shows the current state, the attribute the state at page load. If you run jQuery('#dt-as-draft').prop( 'checked' ) in the browser console, you should get an accurate result when unchecked.
@dinhtungdu I think this is ready for another review. I recommend suppressing white space.
For now I have kept all the built asset file names the same which means the webpack config is a little odd. I've done this for back-compat but if it's decided it isn't needed then that can be done in a smaller follow up commit.