import getLoaders from '../loaders' ; import { HASH_NAME_PROD } from '../../../config/constants' ; import { Configuration , SplitChunksOptions , Optimization , Plugin , BalmScripts } from '@balm-core/index' ; function getDefaultPlugins ( webpack , scripts ) { const plugins = [ new webpack . IgnorePlugin ( /^\.\/locale$/ , /moment$/ ) ] ; if ( scripts . injectHtml ) { const HtmlWebpackPlugin = require ( 'html-webpack-plugin' ) ; const isSPA = BalmJS . entries . length < 2 ; const titles = ( scripts . htmlPluginOptions as { title ? : string | string [ ] ; } ) . title || [ 'BalmJS App' ] ; if ( ! BalmJS . entries . length ) { BalmJS . entries . push ( { key : 'main' , value : `./${ BalmJS . file . defaultEntry }` } ) ; } BalmJS . entries . forEach ( ( entry , index ) => { const entryName = isSPA ? 'index' : entry . key ; const chunks = isSPA ? '?' : [ entryName ] ; const title = titles [ index ] ; const options = Object . assign ( { filename : BalmJS . file . absPath ( `${ BalmJS . config . src . base }/${ entryName }.html` ) , chunks } , scripts . htmlPluginOptions , { title } ) ; plugins . push ( new HtmlWebpackPlugin ( options ) ) ; } ) ; } return plugins ; } function getSplitChunks ( ) { const scripts = BalmJS . config . scripts ; const jsFolder = BalmJS . config . paths . target . js ; let cacheGroups = { } ; if ( scripts . extractAllVendors ) { const jsFilename = scripts . useCache ? `${ scripts . vendorName }.${ HASH_NAME_PROD }.js` : `${ scripts . vendorName }.js` ; cacheGroups = { vendors : { name : 'vendors' , chunks : 'all' , test : /[\\/](node_modules|bower_components)[\\/]/ , filename : BalmJS . file . assetsPath ( `${ jsFolder }/${ jsFilename }` ) } } ; } else if ( BalmJS . vendors . length ) { cacheGroups = { } ; for ( const vendor of BalmJS . vendors ) { const cacheGroupKey = vendor . key ; const cacheGroupModules = vendor . value . join ( '|' ) ; const jsFilename = scripts . useCache ? `${ cacheGroupKey }.${ HASH_NAME_PROD }.js` : `${ cacheGroupKey }.js` ; cacheGroups [ cacheGroupKey ] = { name : cacheGroupKey , chunks : 'initial' , test : new RegExp ( `[\\\\/](${ cacheGroupModules })[\\\\/].*(?<!\\.css)$` ) , filename : BalmJS . file . assetsPath ( `${ jsFolder }/${ scripts . vendorName }/${ jsFilename }` ) , enforce : true } ; } } if ( BalmJS . config . env . isProd && BalmJS . config . scripts . extractCss ) { cacheGroups . css = { name : 'css' , chunks : 'all' , test : /\.css$/ , enforce : true } ; } return Object . keys ( cacheGroups ) . length ? { cacheGroups } : false ; } function getCommonConfig ( webpack , scripts ) { const splitChunks = getSplitChunks ( ) ; const optimization = splitChunks ? ( BalmJS . utils . deepMerge ( { splitChunks } , scripts . optimization ) as Optimization ) : scripts . optimization ; return { context : BalmJS . config . workspace , mode : 'none' , module : { rules : getLoaders ( scripts . loaders ) , strictExportPresence : true } , resolve : { modules : [ 'node_modules' , 'bower_components' , BalmJS . file . absPath ( BalmJS . config . src . base ) ] , extensions : [ '.wasm' , '.mjs' , '.js' , '.json' , '.jsx' , '.ts' , '.tsx' , '.vue' , ... scripts . extensions ] , alias : scripts . alias , descriptionFiles : [ 'package.json' , 'bower.json' ] , mainFields : [ 'main' , 'browser' , 'module' ] } , optimization , plugins : [ ... getDefaultPlugins ( webpack , scripts ) , ... scripts . plugins ] , target : scripts . target , stats : scripts . stats } ; } export default getCommonConfig ;