woocommerce/packages/js
louwie17 aec4dfd3bd
Update product editor package (#36830)
* Add missing dev packages to product-editor package

* Create components folder for organization

* Move product field, section and tab slots over to product-editor package

* Move use of product slot fills to product-editor package

* Sync dependencies

* Add changelogs

* Update README's and add constant for default values

* Update README's in product-editor package
2023-02-24 09:37:53 -04:00
..
admin-e2e-tests Update `config@3.3.7` (from `3.3.3`) (#33828) 2023-02-14 18:34:00 +13:00
api Consolidate eslint versions (#36700) 2023-02-02 23:25:04 +13:00
api-core-tests Consolidate eslint versions (#36700) 2023-02-02 23:25:04 +13:00
components Update product editor package (#36830) 2023-02-24 09:37:53 -04:00
create-woo-extension Prepare Packages for Release (#36814) 2023-02-14 04:12:09 +13:00
csv-export Consolidate eslint versions (#36700) 2023-02-02 23:25:04 +13:00
currency Consolidate eslint versions (#36700) 2023-02-02 23:25:04 +13:00
customer-effort-score Consolidate eslint versions (#36700) 2023-02-02 23:25:04 +13:00
data Add: shipping plugins in shipping task based on location (#36873) 2023-02-20 21:32:14 +08:00
date Consolidate eslint versions (#36700) 2023-02-02 23:25:04 +13:00
dependency-extraction-webpack-plugin Consolidate eslint versions (#36700) 2023-02-02 23:25:04 +13:00
e2e-core-tests Update `config@3.3.7` (from `3.3.3`) (#33828) 2023-02-14 18:34:00 +13:00
e2e-environment Update `config@3.3.7` (from `3.3.3`) (#33828) 2023-02-14 18:34:00 +13:00
e2e-utils Update `config@3.3.7` (from `3.3.3`) (#33828) 2023-02-14 18:34:00 +13:00
eslint-plugin Consolidate eslint versions (#36700) 2023-02-02 23:25:04 +13:00
experimental Add `fills` prop to `useSlot` return object to fix task list bugs in WP 6.2 (#36887) 2023-02-20 17:07:58 +08:00
explat Consolidate eslint versions (#36700) 2023-02-02 23:25:04 +13:00
extend-cart-checkout-block Update changelogger to 3.3.0 to support PR number capturing with merge (#36266) 2023-01-05 14:42:51 +05:30
internal-e2e-builds Consolidate eslint versions (#36700) 2023-02-02 23:25:04 +13:00
internal-js-tests Consolidate eslint versions (#36700) 2023-02-02 23:25:04 +13:00
internal-style-build Consolidate eslint versions (#36700) 2023-02-02 23:25:04 +13:00
navigation Consolidate eslint versions (#36700) 2023-02-02 23:25:04 +13:00
notices Consolidate eslint versions (#36700) 2023-02-02 23:25:04 +13:00
number Consolidate eslint versions (#36700) 2023-02-02 23:25:04 +13:00
onboarding Prepare Packages for Release (#36825) 2023-02-14 09:43:17 +08:00
product-editor Update product editor package (#36830) 2023-02-24 09:37:53 -04:00
tracks Consolidate eslint versions (#36700) 2023-02-02 23:25:04 +13:00
README.md Fix JS package readme (#35595) 2022-11-16 11:54:47 +13:00
tsconfig-cjs.json Added EOF Newlines 2022-05-10 13:35:31 -07:00
tsconfig.json Update dependencies and jest config to pass admin tests for pnpm 7 (#34428) 2022-08-31 12:06:51 +08:00

README.md

WooCommerce Packages

Currently we have a set of public-facing packages that can be dowloaded from npm and used in external applications. Here is a non-exhaustive list.

  • @woocommerce/components: A library of components that can be used to create pages in the WooCommerce dashboard and reports pages.
  • @woocommerce/csv-export: A set of functions to convert data into CSV values, and enable a browser download of the CSV data.
  • @woocommerce/currency: A class to display and work with currency values.
  • @woocommerce/date: A collection of utilities to display and work with date values.
  • @woocommerce/navigation: A collection of navigation-related functions for handling query parameter objects, serializing query parameters, updating query parameters, and triggering path changes.
  • @woocommerce/tracks: User event tracking utility functions for Automattic based projects.

Working with existing packages

  • You can make changes to packages files as normal, and running pnpm start will compile and watch both app files and packages.
  • ⚠️ Add any dependencies to a package using pnpm add from the package root.
  • ⚠️ Make sure you're not importing from any other files outside of the package (you can import from other packages, just use the import from @woocommerce/package syntax).
  • Don't change the version in package.json.
  • Label your PR with the Packages label.
  • See the Package Release Tool for instructions on how to release packages.

Creating a new package

Most of this is pulled from the Gutenberg workflow.

To create a new package, add a new folder to /packages, containing…

  1. package.json based on the template:

    {
    	"name": "@woocommerce/package-name",
    	"version": "1.0.0-beta.0",
    	"description": "Package description.",
    	"author": "Automattic",
    	"license": "GPL-2.0-or-later",
    	"keywords": [ "wordpress", "woocommerce" ],
    	"homepage": "https://github.com/woocommerce/woocommerce/tree/trunk/packages/js/[_YOUR_PACKAGE_]/README.md",
    	"repository": {
    		"type": "git",
    		"url": "https://github.com/woocommerce/woocommerce.git"
    	},
    	"bugs": {
    		"url": "https://github.com/woocommerce/woocommerce/issues"
    	},
    	"main": "build/index.js",
    	"module": "build-module/index.js",
    	"react-native": "src/index",
    	"publishConfig": {
    		"access": "public"
    	}
    }
    
  2. .npmrc file which disables creating package-lock.json file for the package:

    package-lock=false
    
  3. README.md file containing at least:

    • Package name
    • Package description
    • Installation details
    • Usage example
  4. A src directory for the source of your module, which will be built by default using the pnpm run turbo:build command. Note that you'll want an index.js file that exports the package contents, see other packages for examples.

  5. Add the new package name to packages/js/dependency-extraction-webpack-plugin/assets/packages.js so that users of that plugin will also be able to use the new package without enqueuing it.