1.0.0 • Published 4 years ago
webpack-html-embed-source-plugin v1.0.0
webpack-html-embed-source-plugin
webpack插件，用于将指定的css、js资源内联到入口html文件中.
使用
npm i -D webpack-html-embed-source-plugin添加至 webpack.config.js:
const WebpackHtmlEmbedSourcePlugin = require('webpack-html-embed-source-plugin');
webpackConfig.plugins = [
new HtmlWebpackPlugin(),
new WebpackHtmlEmbedSourcePlugin({
prepend: [
Path.resolve(__dirname, './src/prepend.css'),
Path.resolve(__dirname, './src/prepend.js')
],
append: [
Path.resolve(__dirname, './src/append.css'),
Path.resolve(__dirname, './src/append.js')
],
tests: [
/index.*.css/,
/runtime.*.js/
]
})
]; 输出
<!doctype html>
<html lang="zh">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no,width=device-width" />
<meta name="format-detection" content="telephone=no,email=no" />
<meta name="renderer" content="webkit" />
<meta http-equiv="Content-Security-Policy" />
<meta name="description" content="" />
<link rel="canonical" href="" />
<title></title>
<style>prepend css code here...</style>
<style>index css code here...</style>
<style>append css code here...</style>
</head>
<body>
<script>prepend script code here...</script>
<script>runtime chunk code here...</script>
<script src="index.1c6b3af198c8.js"></script>
<script>append script code here...</script>
</body>
</html>参数
new WebpackHtmlEmbedSourcePlugin({ prepend, append, tests })
prepend
Type: Array<string>
追加指定的外部资源，将会内联到固定资源的前部.
append
Type: Array<string>
追加指定的外部资源，将会内联到固定资源的尾部.
tests
Type: Array<RegExp>
该参数为一个资源匹配列表，将会把匹配的chunk内联至html.
1.0.0
4 years ago