c6048b5c49
* add uuid to syncpack * add rimraf to syncpack * add glob to syncpack * Add changefile(s) from automation for the following project(s): @woocommerce/tracks, @woocommerce/product-editor, @woocommerce/onboarding, @woocommerce/number, @woocommerce/notices, @woocommerce/navigation, @woocommerce/internal-js-tests, @woocommerce/integrate-plugin, @woocommerce/expression-evaluation, @woocommerce/explat, @woocommerce/experimental, @woocommerce/eslint-plugin, @woocommerce/dependency-extraction-webpack-plugin, @woocommerce/date, @woocommerce/data, @woocommerce/customer-effort-score, @woocommerce/currency, @woocommerce/csv-export, @woocommerce/components, @woocommerce/block-templates, @woocommerce/ai, @woocommerce/admin-layout, @woocommerce/admin-e2e-tests, woocommerce --------- Co-authored-by: Ron Rennick <ronald.rennick@automattic.com> Co-authored-by: github-actions <github-actions@github.com> |
||
|---|---|---|
| .. | ||
| abstracts | ||
| changelog | ||
| .eslintrc.js | ||
| .npmrc | ||
| README.md | ||
| index.js | ||
| package.json | ||
| style-asset-plugin.js | ||
README.md
Style Build Helper
This is a partial Webpack config for building WooCommece component styles using base styles from Gutenberg. It is used to replace the 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.
// 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,
};