Skip to content

Instantly share code, notes, and snippets.

@robertknight
Last active July 8, 2022 01:32
Show Gist options
  • Star 63 You must be signed in to star a gist
  • Fork 10 You must be signed in to fork a gist
  • Save robertknight/058a194f45e77ff95fcd to your computer and use it in GitHub Desktop.
Save robertknight/058a194f45e77ff95fcd to your computer and use it in GitHub Desktop.
Minimal Webpack DllPlugin example
var square = require('./vendor');
console.log(square(7));
var webpack = require('webpack');
module.exports = {
entry: {
app: ['./app'],
},
output: {
filename: 'app.bundle.js',
path: 'build/',
},
plugins: [new webpack.DllReferencePlugin({
context: '.',
manifest: require('./build/vendor-manifest.json'),
})]
};

Compile with:

webpack --config vendor.webpack.config.js
webpack --config app.webpack.config.js

Use with the following index.html

<script src="build/vendor.bundle.js"></script>
<script src="build/app.bundle.js"></script>
function square(n) {
return n*n;
}
module.exports = square;
var webpack = require('webpack');
module.exports = {
entry: {
vendor: ['./vendor'],
},
output: {
filename: 'vendor.bundle.js',
path: 'build/',
library: 'vendor_lib',
},
plugins: [new webpack.DllPlugin({
name: 'vendor_lib',
path: 'build/vendor-manifest.json',
})]
};
@Eoksni
Copy link

Eoksni commented Apr 10, 2017

@amilajack This does work with webpack 2 after modifying paths to be absolute instead of relative. I created a fork for that https://gist.github.com/Eoksni/83d1f1559e0ec00d0e89c33a6d763049

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment