Scripts: Add plugin-zip command to create a zip file for a WordPres…

…s plugin (#37687)

bin/test-create-block.sh

@@ -36,3 +36,6 @@ status "Lintig CSS files..."
 
 status "Linting JavaScript files..."
 ../node_modules/.bin/wp-scripts lint-js
+
+status "Creating a plugin zip file..."
+../node_modules/.bin/wp-scripts plugin-zip

packages/create-block/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ## Unreleased
 
+### New Features
+
+-   Integrated a new `plugin-zip` command to create a zip file for a WordPress plugin ([#37687](https://github.com/WordPress/gutenberg/pull/37687)).
+
 ### Enhancement
 
 -   Speed up scaffolding process by omitting WordPress dependencies in the template ([#37639](https://github.com/WordPress/gutenberg/pull/37639)).

packages/create-block/lib/init-package-json.js

@@ -40,8 +40,9 @@ module.exports = async ( {
 					format: 'wp-scripts format',
 					'lint:css': 'wp-scripts lint-style',
 					'lint:js': 'wp-scripts lint-js',
-					start: 'wp-scripts start',
 					'packages-update': 'wp-scripts packages-update',
+					'plugin-zip': 'wp-scripts plugin-zip',
+					start: 'wp-scripts start',
 				},
 			},
 			isEmpty

packages/create-block/lib/templates/esnext/.gitignore.mustache

@@ -20,8 +20,11 @@ node_modules/
 # Optional eslint cache
 .eslintcache
 
-# Output of 'npm pack'
+# Output of `npm pack`
 *.tgz
 
+# Output of `wp-scripts plugin-zip`
+*.zip
+
 # dotenv environment variables file
 .env

packages/scripts/CHANGELOG.md

@@ -11,6 +11,7 @@
 
 ### New Features
 
+-   Added a new `plugin-zip` command to create a zip file for a WordPress plugin ([#37687](https://github.com/WordPress/gutenberg/pull/37687)).
 -   Added optional support for React Fast Refresh in the `start` command. It can be activated with `--hot` CLI argument ([#28273](https://github.com/WordPress/gutenberg/pull/28273)).
 
 ### Bug Fixes

packages/scripts/README.md

@@ -37,6 +37,7 @@ _Example:_
 		"lint:md:js": "wp-scripts lint-md-js",
 		"lint:pkg-json": "wp-scripts lint-pkg-json",
 		"packages-update": "wp-scripts packages-update",
+		"plugin-zip": "wp-scripts plugin-zip",
 		"start": "wp-scripts start",
 		"test:e2e": "wp-scripts test-e2e",
 		"test:unit": "wp-scripts test-unit-js"
@@ -303,6 +304,34 @@ _Example:_
 
 The command checks which packages whose name starts with `@wordpress/` are used in the project by reading the package.json file, and then executes `npm install @wordpress/package1@latest @wordpress/package2@latest ... --save` to change the package versions to the latest one.
 
+### `packages-update`
+
+Creates a zip file for a WordPress plugin.
+
+_Example:_
+
+```json
+{
+	"scripts": {
+		"plugin-zip": "wp-scripts plugin-zip"
+	}
+}
+```
+
+By default, it uses [Plugin Handbook best practices](https://developer.wordpress.org/plugins/plugin-basics/best-practices/#file-organization) to discover files.
+
+#### Advanced information
+
+In the case where the plugin author wants to customize the files included in the zip file, they can provide the `files` field in the `package.json` file as documented in the [`npm-packlist`](https://www.npmjs.com/package/npm-packlist) package, example:
+
+```json
+{
+	"files": [ "dir" ]
+}
+```
+
+It reuses the same logic as `npm pack` command to create an npm package tarball.
+
 ### `start`
 
 Transforms your code according the configuration provided so it’s ready for development. The script will automatically rebuild if you make changes to the code, and you will see the build errors in the console. The entry point for your project’s code should be located in `src/index.js` (other supported extensions: `.jsx`, `.ts`, and `.tsx`). The output generated will be written to `build/index.js`. For single builds, better suited for production, see the [build](#build) script.

packages/scripts/package.json

@@ -44,6 +44,7 @@
 		"@wordpress/postcss-plugins-preset": "file:../postcss-plugins-preset",
 		"@wordpress/prettier-config": "file:../prettier-config",
 		"@wordpress/stylelint-config": "file:../stylelint-config",
+		"adm-zip": "^0.5.9",
 		"babel-jest": "^26.6.3",
 		"babel-loader": "^8.2.3",
 		"browserslist": "^4.17.6",
@@ -70,6 +71,7 @@
 		"mini-css-extract-plugin": "^2.1.0",
 		"minimist": "^1.2.0",
 		"npm-package-json-lint": "^5.0.0",
+		"npm-packlist": "^3.0.0",
 		"postcss": "^8.2.15",
 		"postcss-loader": "^6.1.1",
 		"prettier": "npm:wp-prettier@2.2.1-beta-1",

packages/scripts/scripts/plugin-zip.js

@@ -0,0 +1,56 @@
+/**
+ * External dependencies
+ */
+const AdmZip = require( 'adm-zip' );
+const { sync: glob } = require( 'fast-glob' );
+const { sync: packlist } = require( 'npm-packlist' );
+const { dirname } = require( 'path' );
+const { stdout } = require( 'process' );
+
+/**
+ * Internal dependencies
+ */
+const { hasPackageProp, getPackageProp } = require( '../utils' );
+
+const name = getPackageProp( 'name' );
+stdout.write( `Creating archive for \`${ name }\` plugin... 🎁\n\n` );
+const zip = new AdmZip();
+
+let files = [];
+if ( hasPackageProp( 'files' ) ) {
+	stdout.write(
+		'Using the `files` field from `package.json` to detect files:\n\n'
+	);
+	files = packlist();
+} else {
+	stdout.write(
+		'Using Plugin Handbook best practices to discover files:\n\n'
+	);
+	// See https://developer.wordpress.org/plugins/plugin-basics/best-practices/#file-organization.
+	files = glob(
+		[
+			'admin/**',
+			'build/**',
+			'includes/**',
+			'languages/**',
+			'public/**',
+			`${ name }.php`,
+			'uninstall.php',
+			'block.json',
+			'changelog.*',
+			'license.*',
+			'readme.*',
+		],
+		{
+			caseSensitiveMatch: false,
+		}
+	);
+}
+
+files.forEach( ( file ) => {
+	stdout.write( `  Adding \`${ file }\`.\n` );
+	zip.addLocalFile( file, dirname( file ) );
+} );
+
+zip.writeZip( `./${ name }.zip` );
+stdout.write( `\nDone. \`${ name }.zip\` is ready! 🎉\n` );