4

Firstly, using webpack.DllPlugin to generate vendor.dll.js.

Secondly, using html-webpack-include-assets-plugin to insert vendor.dll.js into html, which generated by HtmlWebpackPlugin. Like this:

new HtmlWebpackPlugin(),
new webpack.DllReferencePlugin({
     context: __dirname,
     manifest: require('./vendor-manifest.json')
})
new HtmlWebpackIncludeAssetsPlugin({
     assets: ['vendor.dll.js'],
     hash: true,
     append: false,
})

Question:

How can I to insert vendor.dll.js into an exsiting html, without using html-webpack-plugin ?

Thanks

Patrick Hund
  • 19,163
  • 11
  • 66
  • 95
summer
  • 41
  • 2
  • What you are trying to do is script injection. You can do it through browser console easily. If you would like automatic injection, then you will need to look into browser extensions such as chrome extension. – Ji_in_coding Dec 20 '17 at 20:30
  • Ji, think you are misunderstanding the question, or perhaps I am – I assume the OP just wants to include the bundle in their own HTML file – Patrick Hund Dec 20 '17 at 20:33

1 Answers1

1

The vendor bundle created by the webpack build is a JavaScript file on your local file system just like any other bundle created by webpack, so you can include it in your existing HTML page just like any other JavaScript file – using a script tag.

<script src="vendor.dll.js"></script>

(note that the actual path depends on your local setup, which I don't know anything about)

Patrick Hund
  • 19,163
  • 11
  • 66
  • 95
  • 2
    Sorry, I don't make the question clear. Actually, the name of vendor.dll.js is generated by this: '[name]_[hash]'. so the name could change. I am just wondering if webpack can help me to automatically inject this script into an existing html. BTW, Thanks for your reply. – summer Dec 21 '17 at 02:23
  • I have the same problem, the name is not always the same for the injected script, due to the 'hash'. So how can we do this automatically on build? – user2078023 Mar 26 '19 at 11:51