webpack 4 の optimization.splitChunks について

Question

実現したいこと

index.js と index2.js で読み込んでいる sample-alert.js がバンドルされた vendor.js が生成されることを期待しているが、期待通りにならない。
下記のサイトを参考にしました。
https://qiita.com/soarflat/items/1b5aa7163c087a91877d

該当のソースコード

index.js

import {sayMessage} from "./sample-alert.js";
sayMessage("こんにちは世界1");

index2.js

import {sayMessage} from "./sample-alert.js";
sayMessage("こんにちは世界2");

sample-alert.js

export function sayMessage(message) {
  alert(message);
}

sample-alert.js

var SRC = './src/';

module.exports = {
	mode: "development",
	entry: {
		bundle: SRC + "js/index.js",
		bundle2: SRC + "js/index2.js"
	},
	output: {
		filename: "[name].js"
	},
	optimization: {
		splitChunks: {
			name: 'vendor',
			chunks: 'initial'
		}
	},
	module: {
		rules: [
			{
				test: /.js$/,
				use: [
					{
						loader: 'babel-loader',
						options: {
							presets: [
								['env', {'modules': false}]
							]
						}
					}
				]
			}
		]
	}	
}

出力結果は
/js/bundle.js
/js/bundle2.js

試したこと

index2.jsを下記に修正したら、
vendor.js が生成され、そこにはjqueryだけではなく、sample-alert.jsも含まれていた

index2.js

import $ from 'jquery';
import {sayMessage} from "./sample-alert.js";
sayMessage("こんにちは世界2");

出力結果は
/js/bundle.js
/js/bundle2.js
/js/vendor.js

Answer 1

https://qiita.com/soarflat/items/1b5aa7163c087a91877d
をよく読み返し、cacheGroupsの設定で解決しました。
ありがとうございました。