michael-wolfenden/common.js

## common.js
// common modules used on every page
import axios from 'axios'
import Vue from 'vue'

// common css used on every page
import './shared.css'

// some global initialization
alert('common')

## pageA.html
<!--
This page should trigger the common alert and the pageA alert
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="shared.css" />
</head>
<body>
    <script src="shared.js"></script>
    <script src="pageA.js"></script>
</body>
</html>

## pageA.js
import axios from 'axios'
import Vue from 'vue'

// module only used on this page
import moment from 'moment'

alert('pageA')

## webpack.config.js
module.exports = {
    entry: {
        common: './common',
        pageA: './pageA',
        /* a bunch more pages
        pageB: './pageB',
        pageC: './pageC',
        */
    },

    plugins: [
        new webpack.optimize.CommonsChunkPlugin({
            name: ['common'],
            minChunks: Infinity,
        }),
    ],
}
	// common modules used on every page
	import axios from 'axios'
	import Vue from 'vue'

	// common css used on every page
	import './shared.css'

	// some global initialization
	alert('common')
	<!--
	This page should trigger the common alert and the pageA alert
	-->
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<link rel="stylesheet" href="shared.css" />
	</head>
	<body>
	<script src="shared.js"></script>
	<script src="pageA.js"></script>
	</body>
	</html>
	import axios from 'axios'
	import Vue from 'vue'

	// module only used on this page
	import moment from 'moment'

	alert('pageA')
	module.exports = {
	entry: {
	common: './common',
	pageA: './pageA',
	/* a bunch more pages
	pageB: './pageB',
	pageC: './pageC',
	*/
	},

	plugins: [
	new webpack.optimize.CommonsChunkPlugin({
	name: ['common'],
	minChunks: Infinity,
	}),
	],
	}