diff --git a/plugins/woocommerce-blocks/.gitignore b/plugins/woocommerce-blocks/.gitignore index f8273c9c3cf..17b1a8cd263 100644 --- a/plugins/woocommerce-blocks/.gitignore +++ b/plugins/woocommerce-blocks/.gitignore @@ -48,3 +48,4 @@ tests/cli/vendor # Built files /build/ bin/languages +woocommerce-gutenberg-products-block.zip diff --git a/plugins/woocommerce-blocks/CONTRIBUTING.md b/plugins/woocommerce-blocks/CONTRIBUTING.md index bf8a2690d6f..f927b298cad 100644 --- a/plugins/woocommerce-blocks/CONTRIBUTING.md +++ b/plugins/woocommerce-blocks/CONTRIBUTING.md @@ -10,10 +10,10 @@ We have a set of scripts in npm to handle repeated developer tasks. ### `$ npm run build` & `$ npm start` -These scripts compile the code using `webpack`. +These scripts compile the code using `webpack`. - Run `$ npm run build` to build all assets for production. -- Run `$ npm start` to build assets and watch for changes (useful for development). +- Run `$ npm start` to build assets and watch for changes (useful for development). You can also run `$ npx webpack` to run the development build and not keep watching. @@ -36,6 +36,10 @@ The test scripts use [wp-scripts](https://github.com/WordPress/gutenberg/tree/ma This script is run automatically when `$ npm pack` or `$ npm publish` is run. It installs packages, runs the linters, runs the tests, and then builds assets from source once more. +### `$ npm run package-plugin` + +This script run `npm install` and `npm run build` and then creates a zip file automatically for you which you can use to install WooCommerce Blocks through the WordPress admin. + ## Tagging new releases on GitHub If you have commit access, tagging a new version on GitHub can be done by running the following script: @@ -64,7 +68,7 @@ __Important:__ Before running the release script ensure you have already pushed ## Publishing `@woocommerce/block-library` -We publish the blocks to npm at [@woocommerce/block-library,](https://www.npmjs.com/package/@woocommerce/block-library) and then import them into WooCommerce core via [a grunt script.](https://github.com/woocommerce/woocommerce/blob/741bd5ba6d193e21893ef3af3d4f3f030a79c099/Gruntfile.js#L347) +We publish the blocks to npm at [@woocommerce/block-library,](https://www.npmjs.com/package/@woocommerce/block-library) and then import them into WooCommerce core via [a grunt script.](https://github.com/woocommerce/woocommerce/blob/741bd5ba6d193e21893ef3af3d4f3f030a79c099/Gruntfile.js#L347) To release a new version, there are 3 basic steps. Prepare and test the release, publish the version, then import into WooCommerce core. diff --git a/plugins/woocommerce-blocks/bin/build-plugin-zip.sh b/plugins/woocommerce-blocks/bin/build-plugin-zip.sh new file mode 100755 index 00000000000..29ae04bc7f5 --- /dev/null +++ b/plugins/woocommerce-blocks/bin/build-plugin-zip.sh @@ -0,0 +1,100 @@ +#!/bin/bash + +# Exit if any command fails. +set -e + +# Store paths +SOURCE_PATH=$(pwd) + +# Change to the expected directory. +cd "$(dirname "$0")" +cd .. + +# Enable nicer messaging for build status. +BLUE_BOLD='\033[1;34m'; +GREEN_BOLD='\033[1;32m'; +RED_BOLD='\033[1;31m'; +YELLOW_BOLD='\033[1;33m'; +COLOR_RESET='\033[0m'; +error () { + echo -e "\n${RED_BOLD}$1${COLOR_RESET}\n" +} +status () { + echo -e "\n${BLUE_BOLD}$1${COLOR_RESET}\n" +} +success () { + echo -e "\n${GREEN_BOLD}$1${COLOR_RESET}\n" +} +warning () { + echo -e "\n${YELLOW_BOLD}$1${COLOR_RESET}\n" +} + +copy_dest_files() { + CURRENT_DIR=$(pwd) + cd "$1" || exit + rsync ./ "$2"/ --recursive --delete --delete-excluded \ + --exclude=".*/" \ + --exclude="*.md" \ + --exclude=".*" \ + --exclude="composer.*" \ + --exclude="*.lock" \ + --exclude=bin/ \ + --exclude=node_modules/ \ + --exclude=tests/ \ + --exclude=phpcs.xml \ + --exclude=phpunit.xml.dist \ + --exclude=renovate.json \ + --exclude="*.config.js" \ + --exclude="*-config.js" \ + --exclude=package.json \ + --exclude=package-lock.json \ + --exclude=none \ + --exclude=woocommerce-gutenberg-products-block.zip \ + --exclude="zip-file/" + status "Done copying files!" + cd "$CURRENT_DIR" || exit +} + +status "💃 Time to release WooCommerce Blocks 🕺" + +if [ -z "$NO_CHECKS" ]; then + # Make sure there are no changes in the working tree. Release builds should be + # traceable to a particular commit and reliably reproducible. (This is not + # totally true at the moment because we download nightly vendor scripts). + changed= + if ! git diff --exit-code > /dev/null; then + changed="file(s) modified" + elif ! git diff --cached --exit-code > /dev/null; then + changed="file(s) staged" + fi + if [ ! -z "$changed" ]; then + git status + error "ERROR: Cannot build plugin zip with dirty working tree. ☝️ + Commit your changes and try again." + exit 1 + fi +fi + +# Run the build. +status "Installing dependencies... 📦" +PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true npm install +status "===========================" +npm list webpack +status "Generating build... 👷‍♀️" +status "===========================" +npm list webpack +npm run build +status "===========================" +npm list webpack + +# Generate the plugin zip file. +status "Creating archive... 🎁" +mkdir zip-file +mkdir zip-file/build +copy_dest_files $SOURCE_PATH "$SOURCE_PATH/zip-file" +cd zip-file +zip -r ../woocommerce-gutenberg-products-block.zip ./ +cd .. +rm -r zip-file + +success "Done. You've built WooCommerce Blocks! 🎉" diff --git a/plugins/woocommerce-blocks/package.json b/plugins/woocommerce-blocks/package.json index c6641b8ad9f..badb22298b9 100644 --- a/plugins/woocommerce-blocks/package.json +++ b/plugins/woocommerce-blocks/package.json @@ -27,6 +27,7 @@ "lint:css-fix": "stylelint 'assets/**/*.scss' --fix", "lint:js": "eslint assets/js --ext=js,jsx", "lint:js-fix": "eslint assets/js --ext=js,jsx --fix", + "package-plugin": "./bin/build-plugin-zip.sh", "test": "wp-scripts test-unit-js --config tests/js/jest.config.json", "test:help": "wp-scripts test-unit-js --help", "test:update": "wp-scripts test-unit-js --updateSnapshot --config tests/js/jest.config.json",