Webpack & TypeScript CommonsChunkPlugin not working -


i've followed few guides setting commonschunkplugin doesn't seem working. i've searched , read other posts on here no luck.

i have 3 files (typescript) importing few of same libraries (fancybox, moment , pikaday). being imported using es module syntax:

import * fancybox 'fancybox'; import * moment 'moment'; import * pikaday 'pikaday'; 

my tsconfig.json set output es6 syntax , modules:

{     "compileonsave": true,     "compileroptions": {         "target": "es6",         "module": "es6",         "noemitonerror": true,         "moduleresolution": "node",         "sourcemap": true,         "diagnostics": false,         "nofallthroughcasesinswitch": true,         "noimplicitreturns": true,         "traceresolution": false     },     "exclude": [         "node_modules",         "venue-finder"     ] } 

my webpack.config.js:

const webpack = require('webpack'); const path = require('path'); const webpacknotifierplugin = require('webpack-notifier'); const bundleanalyzerplugin = require('webpack-bundle-analyzer').bundleanalyzerplugin;  module.exports = [{     bail: true,     entry: {         global: path.resolve(__dirname, 'js/responsive/global.ts'),         todo: path.resolve(__dirname, 'js/todo/todo.ts'),         budget: path.resolve(__dirname, 'planner/javascript/budget/budgetplannerui.ts'),         promotions: path.resolve(__dirname, 'js/promotions-management.ts'),         planner: path.resolve(__dirname, 'planner/javascript/myplanner.ts')     },     output: {         path: path.resolve(__dirname, 'dist/js'),         filename: '[name].js'     },     module: {         rules: [{             test: /\.ts(x?)$/,             exclude: /node_modules/,             use: [                 {                     loader: 'babel-loader',                     options: {                         'presets': [                             ['env', {                                 'modules': false                             }]                         ]                     }                 },                 {                     loader: 'ts-loader'                 }             ]         }]     },     plugins: [         new webpacknotifierplugin({ alwaysnotify: true }),         new webpack.ignoreplugin(/^\.\/locale$/, /moment$/),         new webpack.optimize.commonschunkplugin({             name: 'commons',             filename: 'commons-bundle.js',             minchunks: 2         }),         new bundleanalyzerplugin()     ],     resolve: {         extensions: ['.js', '.ts', '.tsx']     },     devtool: 'none' }]; 

as far can see should finding chunk used twice or more (which there three) , moving in commons-bundle.js when run webpack , @ output files can see pikaday, moment , fancybox being included in each of files rather being moved commons-bundle.js

any appreciated.

you want have minchunks option function instead of integer value. fancybox, moment, , pickaday coming node_modules, hence modifying minchunks below should work -

new webpack.optimize.commonschunkplugin({             name: 'commons',             filename: 'commons-bundle.js',             chunks: [global, todo, budget, promotions, planner], //optional, find practice             minchunks: function (module) {                return module.context && module.context.indexof("node_modules") !== -1;             }         }), 

Comments

Popular posts from this blog

Command prompt result in label. Python 2.7 -

javascript - How do I use URL parameters to change link href on page? -

amazon web services - AWS Route53 Trying To Get Site To Resolve To www -