woocommerce/packages/js/internal-style-build/README.md

31 lines
1004 B
Markdown

# Style Build Helper
This is a partial [Webpack](https://webpack.js.org/) config for building WooCommerce component styles using base styles from Gutenberg. It is used to replace the [`bin/packages/build.js`](https://github.com/woocommerce/woocommerce-admin/blob/6859249/bin/packages/build.js) script.
## Usage
Create a `webpack.config.js` in your package root that defines the `entry` and `output`, making use of the `rules` and `plugins` from `@woocommerce/internal-style-build`.
***Note:*** The `entry` should be named `'build-style'` so the CSS will get picked up by the main `client/` application's `CopyWebpackPlugin` config.
```js
// packages/<package-name>/webpack.config.js
import { webpackConfig } from '@woocommerce/internal-style-build';
module.exports = {
mode: process.env.NODE_ENV || 'development',
entry: {
'build-style': __dirname + '/src/style.scss',
},
output: {
path: __dirname,
},
module: {
rules: webpackConfig.rules,
},
plugins: webpackConfig.plugins,
};
```