inject-inner-webpack-plugin
will inject internal scripting into the HTML page package plug-in output HTML files of the page package plug-in
The installation
<hr/>
npm install –save-dev inject-inner-webpack-plugin
The sample
<hr/>
webpack.config.js
const HtmlWebpackPlugin = require('html-webpack-plugin');
const InjectInnerWebpackPlugin = require('inject-inner-webpack-plugin');
module.exports = {
entry: {
index: './index.js',
},
plugins: [
new HtmlWebpackPlugin({
template: 'index.html',
}),
new InjectInnerWebpackPlugin(HtmlWebpackPlugin),
],
};
index.html
<! DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Webpack App</title> <! > <script SRC ="./inner.js? __inline"></script> </head> <body> </body> </html>
This will generate a file dist/index.html containing the following
<! DOCTYPE HTML > < HTML > <head> <meta charset="utf-8"> <title>Webpack App</title> <script> // inner.js </script> </head> <body> <script src="index.js"></script> </body> </html>
The entry in webpack.config.js should be Object. Only instances of the HtmlWebpackPlugin with template options are processed.
options
HtmlWebpackPlugin must be passed to the first parameter. The second parameter is optional, for example:
const HtmlWebpackPlugin = require('html-webpack-plugin'); const path = require('path'); new InjectInnerWebpackPlugin(HtmlWebpackPlugin, { context: path.resolve(__dirname, '.. ')});
The allowable values for the second parameter are as follows:
The name of the | type | The default value | instructions |
---|---|---|---|
context | {String} : String | Webpack Context | If you use SRC /inner.js? __inline, the path is relative to the context |
isRemainBundle | {Boolean} : Boolean value | false | If true, the inner block to be printed is reserved. |
scriptTag | {Function} : Function | ` ` | Customize internal content output |
template | {String&Array}: String&Array | ` ` | Specifies the template to inject |