/html-inline-source-webpack-plugin

🔧A webpack plugin to inline source in html, wrapper of inline-source.

Primary LanguageJavaScriptMIT LicenseMIT

npm npm npm bitHound Overall Score bitHound Dependencies bitHound Code Twitter

html-inline-source-webpack-plugin

🔧A webpack plugin to inline source in html, wrapper of inline-source.

Env

  • Node - v4.7.0
  • npm - 2.15.11
  • webpack - ^1.14.0

Installation

$ npm install --save-dev html-inline-source-webpack-plugin

Usage

webpack.config.js

// webpack.config.js
let HtmlInlineSourceWebpackPlugin = require('html-inline-source-webpack-plugin');

module.exports = {
    /* Your config */
    plugins : [
        /* ... */
        new HtmlInlineSourceWebpackPlugin(),
    ],
};

index.html

<!DOCTYPE html>
<html>
<head>
    <title> index </title>
    <link inline href="css/index.css" rel="stylesheet">
</head>
<body>
    <script inline src="js/index.js" charset="utf-8"></script>
</body>
</html>

Notice

<script inline src="js/index.js" charset="utf-8"></script>
  • Use inline attribute to inline source;
  • Ensure src or href is linked to a correct file.

Options

Default option

new HtmlInlineSourceWebpackPlugin()

Custom option

This option would apply to all files.

new HtmlInlineSourceWebpackPlugin({
    option : {
        compress : false,
        rootpath : path.resolve('./dist'),
    },
})

Custom option for different file

Use test to let different option apply to different files.

new HtmlInlineSourceWebpackPlugin([
    {
        test : /\bindex\.html$/,
        option : {
            ignore : 'script',
            rootpath : path.resolve('./dist'),
        },
    },
    {
        test : /\bexample\.html$/,
        option : {
            ignore : 'css',
            rootpath : path.resolve('./dist'),
        },
    },
    {
        /* This option would apply to the rest files */
        option : {
            ignore : ['script', 'css'],
            rootpath : path.resolve('./dist'),
        },
    },
])

More option

see here.

Callback

new HtmlInlineSourceWebpackPlugin(function () {
    console.log('inline source done!');
})
/* or */
new HtmlInlineSourceWebpackPlugin({
    /* option */
}, function () {
    console.log('inline source done!');
})

Related

License

MIT