woocommerce/plugins/woocommerce-blocks/webpack.config.js

149 lines
4.2 KiB
JavaScript
Raw Normal View History

/**
* External dependencies
*/
const path = require( 'path' );
const MergeExtractFilesPlugin = require( './bin/merge-extract-files-webpack-plugin' );
const MiniCssExtractPlugin = require( 'mini-css-extract-plugin' );
const { CleanWebpackPlugin } = require( 'clean-webpack-plugin' );
const ProgressBarPlugin = require( 'progress-bar-webpack-plugin' );
const DependencyExtractionWebpackPlugin = require( '@wordpress/dependency-extraction-webpack-plugin' );
const chalk = require( 'chalk' );
const NODE_ENV = process.env.NODE_ENV || 'development';
function findModuleMatch( module, match ) {
if ( module.request && match.test( module.request ) ) {
return true;
} else if ( module.issuer ) {
return findModuleMatch( module.issuer, match );
}
return false;
}
/**
* Config for compiling Gutenberg blocks JS.
*/
const GutenbergBlocksConfig = {
mode: NODE_ENV,
entry: {
// Shared blocks code
blocks: './assets/js/index.js',
frontend: [ './assets/js/blocks/product-categories/frontend.js' ],
// Blocks
'handpicked-products': './assets/js/blocks/handpicked-products/index.js',
'product-best-sellers': './assets/js/blocks/product-best-sellers/index.js',
'product-category': './assets/js/blocks/product-category/index.js',
'product-categories': './assets/js/blocks/product-categories/index.js',
'product-new': './assets/js/blocks/product-new/index.js',
'product-on-sale': './assets/js/blocks/product-on-sale/index.js',
'product-top-rated': './assets/js/blocks/product-top-rated/index.js',
'products-by-attribute': './assets/js/blocks/products-by-attribute/index.js',
'featured-product': './assets/js/blocks/featured-product/index.js',
Introduce a new Products by Tag(s) block (https://github.com/woocommerce/woocommerce-blocks/pull/554) * Introduced WGPB_Extend_Core class to modify shortcodes and API requests of core * Require the new class * WC_REST_Blocks_Products_Controller_V2 to override the wc-blocks API to support new tags properties * Register new products by tag block type * Modify utils to support tags and tag_operators * Add ProductTagControl to handle tag searching * Add the actual products by tag block * Set limitTags to 100 * Create Package class and use in main plugin file * Move and refactor library class - split asset methods into new Assets class. * Add jetpack autoloader dependency * fix tests * Update from master * AbstractBlock class for general block registration * remove test autoloader so tests do not break * Create AbstractProductGrid * FeaturedProduct * HandpickedProducts * ProductBestSellers * ProductCategory * ProductNew * ProductOnSale * ProductTopRated * ProductsByAttribute * Remove old base and render functions * Allow non-dynamic blocks and register category block * Fix products-by-attribute due to wrong naming * Remove no dev * test phpunit dir * Update testing framework * Update with new abstract classes and build in API * Undo edit to attribute block * Move edit mode * No need to support shortcodes * correct linting errors * Update tests/bootstrap.php Co-Authored-By: Albert Juhé Lluveras <aljullu@gmail.com> * Update code comment to make more sense. * Correct test package * docblock * Fix cancel button class * Fix classname schema * Set loading state so spinner is shown * Add placeholder element when no tags are selected * No tags placeholder * Update rest endpoints
2019-07-09 13:42:22 +00:00
'product-tag': './assets/js/blocks/product-tag/index.js',
'featured-category': './assets/js/blocks/featured-category/index.js',
},
output: {
path: path.resolve( __dirname, './build/' ),
filename: '[name].js',
library: [ 'wc', 'blocks', '[name]' ],
libraryTarget: 'this',
// This fixes an issue with multiple webpack projects using chunking
// overwriting each other's chunk loader function.
// See https://webpack.js.org/configuration/output/#outputjsonpfunction
jsonpFunction: 'webpackWcBlocksJsonp',
},
optimization: {
splitChunks: {
cacheGroups: {
packages: {
test: /[\\/]node_modules[\\/]@woocommerce/,
name: 'packages',
chunks: 'all',
enforce: true,
priority: 10, // Higher priority to ensure @woocommerce/* packages are caught here.
},
commons: {
test: /[\\/]node_modules[\\/]/,
name: 'vendors',
chunks: 'all',
enforce: true,
},
editor: {
// Capture all `editor` stylesheets and the components stylesheets.
test: ( module = {} ) =>
module.constructor.name === 'CssModule' &&
( findModuleMatch( module, /editor\.scss$/ ) ||
findModuleMatch( module, /[\\/]components[\\/]/ ) ),
name: 'editor',
chunks: 'all',
enforce: true,
priority: 10,
},
style: {
test: /style\.scss$/,
name: 'style',
chunks: 'all',
enforce: true,
priority: 5,
},
},
},
},
module: {
rules: [
{
test: /\.jsx?$/,
exclude: /node_modules/,
loader: 'babel-loader?cacheDirectory',
},
{
test: /\.s[c|a]ss$/,
use: [
'style-loader',
MiniCssExtractPlugin.loader,
{ loader: 'css-loader', options: { importLoaders: 1 } },
'postcss-loader',
{
loader: 'sass-loader',
query: {
includePaths: [ 'assets/css/abstracts' ],
data:
'@import "_colors"; ' +
'@import "_variables"; ' +
'@import "_breakpoints"; ' +
'@import "_mixins"; ',
},
},
],
},
],
},
plugins: [
new CleanWebpackPlugin(),
new MiniCssExtractPlugin( {
filename: '[name].css',
} ),
new MergeExtractFilesPlugin( [
'build/editor.js',
'build/style.js',
], 'build/vendors.js' ),
new ProgressBarPlugin( {
format: chalk.blue( 'Build' ) + ' [:bar] ' + chalk.green( ':percent' ) + ' :msg (:elapsed seconds)',
} ),
new DependencyExtractionWebpackPlugin( { injectPolyfill: true } ),
],
performance: {
hints: false,
},
stats: {
all: false,
assets: true,
builtAt: true,
colors: true,
errors: true,
hash: true,
timings: true,
},
};
module.exports = [ GutenbergBlocksConfig ];