html-webpack-inline-source-plugin

html-webpack-inline-source-plugin

0.0.10 • Public • Published 2 years ago

Inline Source extension for the HTML Webpack Plugin

Enhances html-webpack-plugin functionality by adding the {inlineSource: 'regex string'} option.

This is an extension plugin for the webpack plugin html-webpack-plugin. It allows you to embed javascript and css source inline.

Installation

You must be running webpack on node 4 or higher

Install the plugin with npm:

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

Basic Usage

Require the plugin in your webpack config:

var HtmlWebpackInlineSourcePlugin = require('html-webpack-inline-source-plugin');

Add the plugin to your webpack config as follows:

plugins: [

  new HtmlWebpackPlugin(),

  new HtmlWebpackInlineSourcePlugin()

]  

The above configuration will actually do nothing due to the configuration defaults.

When you set inlineSource to a regular expression the source code for any javascript or css file names that match will be embedded inline in the resulting html document.

plugins: [

  new HtmlWebpackPlugin({

        inlineSource: '.(js|css)$' // embed all javascript and css inline

    }),

  new HtmlWebpackInlineSourcePlugin()

]  

Sourcemaps

If any source files contain a sourceMappingURL directive that isn't a data URI, then the sourcemap URL is corrected to be relative to the domain root (unless it already is) instead of to the original source file.

All sourcemap comment styles are supported:

  • //# ...
  • //@ ...
  • /*# ...*/
  • /*@ ...*/

Keywords

Install

npm i html-webpack-inline-source-plugin

Weekly Downloads

27,110

Version

0.0.10

License

MIT

Unpacked Size

9.37 kB

Total Files

4

Issues

13

Pull Requests

4

Homepage

github.com/dustinjackson/html-webpack-inline-source-plugin

Repository

github.com/dustinjackson/html-webpack-inline-source-plugin

Try on RunKit

Report a vulnerability

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值