In `@woocommerce/blocks-checkout` package documentation - reference WCDEWP instead of WPDEWP (https://github.com/woocommerce/woocommerce-blocks/pull/5154)

* Reference the WooCommerce DEWP instead of WPDEWP

* Apply suggestions from code review

Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>

Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
This commit is contained in:
Darren Ethier 2021-11-20 07:08:58 -05:00 committed by GitHub
parent c2fb8751be
commit 620cf8aebc
1 changed files with 10 additions and 24 deletions

View File

@ -23,36 +23,22 @@ const { ... } = wc.blocksCheckout;
### Aliased imports
Alternatively, you can map this to external to a custom alias using the [WordPress Dependency Extraction Webpack Plugin](https://github.com/WordPress/gutenberg/tree/trunk/packages/dependency-extraction-webpack-plugin):
Alternatively, you can map this to externals (or aliases) using the [WooCommerce Dependency Extraction Webpack Plugin](https://github.com/woocommerce/woocommerce-admin/tree/main/packages/dependency-extraction-webpack-plugin). Just add the above Webpack plugin to your package.json:
```bash
npm install @woocommerce/dependency-extraction-webpack-plugin --save-dev
```
Now, you can include this plugin in your Webpack configuration:
```js
// webpack.config.js
const DependencyExtractionWebpackPlugin = require( '@wordpress/dependency-extraction-webpack-plugin' );
const dependencyMap = {
'@woocommerce/blocks-checkout': [ 'wc', 'blocksCheckout' ],
};
const handleMap = {
'@woocommerce/blocks-checkout': 'wc-blocks-checkout',
};
const WooCommerceDependencyExtractionWebpackPlugin = require( '@woocommerce/dependency-extraction-webpack-plugin' );
module.exports = {
// …snip
plugins: [
new DependencyExtractionWebpackPlugin( {
injectPolyfill: true,
requestToExternal( request ) {
if ( dependencyMap[ request ] ) {
return dependencyMap[ request ];
}
},
requestToHandle( request ) {
if ( handleMap[ request ] ) {
return handleMap[ request ];
}
},
} ),
new WooCommerceDependencyExtractionWebpackPlugin(),
],
};
```