Skip to content
This repository was archived by the owner on Feb 23, 2024. It is now read-only.

Commit 0fc83ef

Browse files
authored
Add "contributor" docs for developer tools, release processes (#504)
* Docs: Add docs for npm scripts and the release process * Update readme to reflect project status * Add install instructions * Add a link to a previous PR for an example
1 parent f210e22 commit 0fc83ef

File tree

2 files changed

+83
-7
lines changed

2 files changed

+83
-7
lines changed

CONTRIBUTING.md

Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
# Contributing
2+
3+
Thanks for your interest in contributing to WooCommerce Blocks! Below are some developer docs for working with the project.
4+
5+
To get started, first run `npm install` and `composer install`.
6+
7+
## npm scripts
8+
9+
We have a set of scripts in npm to handle repeated developer tasks.
10+
11+
### `build` & `start`
12+
13+
These scripts compile the code using `webpack`. Run `build` to build the production build, `start` to build the development build and then keep watching for changes. You can also run `npx webpack` to run the development build and not keep watching.
14+
15+
### `lint`
16+
17+
This script runs 3 sub-commands: `lint:php`, `lint:css`, `lint:js`. Use these to run linters across the codebase.
18+
19+
- `lint:php` runs phpcs via composer, which uses the [phpcs.xml](https://github.com/woocommerce/woocommerce-gutenberg-products-block/blob/master/phpcs.xml) ruleset.
20+
- `lint:css` runs stylelint over all the scss code in `assets/css`, using the rules in [.stylelintrc.json.](https://github.com/woocommerce/woocommerce-gutenberg-products-block/blob/master/.stylelintrc.json)
21+
- `lint:js` runs eslint over all the JavaScript, using the rules in [.eslintrc.js.](https://github.com/woocommerce/woocommerce-gutenberg-products-block/blob/master/.eslintrc.js)
22+
23+
### `test`
24+
25+
The test scripts use [wp-scripts](https://github.com/WordPress/gutenberg/tree/master/packages/scripts) to run jest for component and unit testing.
26+
27+
- `test:update` updates the snapshot tests for components, used if you change a component that has tests attached.
28+
- Use `test:watch` to keep watch of files and automatically re-run tests.
29+
30+
### `prepack`
31+
32+
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 the files from the source once more.
33+
34+
## Publishing @woocommerce/block-library
35+
36+
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)
37+
38+
To release a new version, there are 3 basic steps. Prepare and test the release, publish the version, then import into WooCommerce core.
39+
40+
### Prepare and test the release
41+
42+
- Manually change the versions in `package.json` and `woocommerce-gutenberg-products-block.php` (once in the plugin header, and `WGPB_VERSION`). [See an example PR with these changes.](https://github.com/woocommerce/woocommerce-gutenberg-products-block/pull/478/commits/725c43fe0362044c953728cb3391095a43e66bb5)
43+
- Run `npm pack` to prep a `.tgz` file.
44+
- Optionally test the package by uploading this onto a test site.
45+
46+
### Publish this version
47+
48+
On GitHub…
49+
50+
- go to [Releases](https://github.com/woocommerce/woocommerce-gutenberg-products-block/releases) and click "Draft a new release"
51+
- The Tag version should start with `v`, and use [semver](https://semver.org/) formatting, ex `v2.0.0-rc`, or `v1.4.1`
52+
- The Release title should be the human-readable version, ex "2.0.0 Release Candidate" or "2.0.0 alpha release"
53+
- Add the changelog to the description (TBD, maybe not for every release?)
54+
- Upload the `.tgz` from `npm pack` in the previous step as an attached binary
55+
56+
On npm…
57+
58+
- Run `npm publish --access public`, which will push the version up to npm.
59+
- Check [@woocommerce/block-library](https://www.npmjs.com/package/@woocommerce/block-library) for your update
60+
61+
### Pull into WooCommerce core
62+
63+
- Manually update the @woocommerce/block-library version in `package.json`
64+
- In the woocommerce folder, run `npm install` to download the version you just specified
65+
- Run the copy command, `npx grunt blocks`, to copy the build files from node_modules into their destinations in WC core
66+
- Check that the changes imported look correct
67+
- Make a PR on WooCommerce to import the new version
68+
69+
## Publishing the WooCommerce Blocks plugin
70+
71+
TBD

README.md

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,28 @@
11
# WooCommerce Product Blocks
22

3-
Feature plugin for the Gutenberg Products block.
3+
Feature plugin for WooCoomerce + Gutenberg. Now that the product blocks have been merged into WooCommerce 3.6, this plugin serves as a space to iterate and explore how else WooCommerce might work with the block editor.
4+
5+
If you're just looking to use these blocks, update to WooCommerce 3.6! The blocks are bundled into WooCommerce, and can be added from the "WooCommerce" section in the block inserter.
6+
7+
If you want to see what we're working on for future versions, or want to help out, read on.
48

59
## Getting started with the stable version:
610

7-
1. The stable version is available on WordPress.org. [Download the stable version here.](https://wordpress.org/plugins/woo-gutenberg-products-block/)
8-
2. Activate the plugin.
9-
3. On Gutenberg posts you should now have a Products block available.
11+
We release a new version of WooCommerce Blocks onto WordPress.org every few weeks, which can be used as an easier way to preview the features.
12+
13+
1. Make sure you have WordPress 5.0+ and WooCommerce 3.6+
14+
2. The stable version is available on WordPress.org. [Download the stable version here.](https://wordpress.org/plugins/woo-gutenberg-products-block/)
15+
3. Activate the plugin.
1016

1117
## Getting started with the development version:
1218

13-
1. Make sure you have WordPress 5.0+ and WooCommerce 3.5.1+
19+
1. Make sure you have WordPress 5.0+ and WooCommerce 3.6+
1420
2. Get a copy of this plugin using the green "Clone or download" button on the right.
1521
3. `npm install` to install the dependencies.
1622
4. `npm run build` (build once) or `npm start` (keep watching for changes) to compile the code.
1723
5. Activate the plugin.
18-
6. On Gutenberg posts & pages you should now have a "Products" block available.
1924

20-
The source code is in the `assets/js/products-block.jsx` file and the compiled code is in `build/products-block.js`.
25+
The source code is in the `assets/` folder and the compiled code is built into `build/`.
2126

2227
**Gutenberg Tutorial and Docs**: https://wordpress.org/gutenberg/handbook/designers-developers/developers/tutorials/block-tutorial/introducing-attributes-and-editable-fields/
2328

0 commit comments

Comments
 (0)