1.0.1 • Published 7 years ago
include-html-webpack-loader v1.0.1
include-html-webpack-loader
本插件是html-withimg-loader插件的简化。只取了前者的模板插入功能,并舍弃了图片加载功能(因为html-withimg-loader会和url-loader冲突)。
安装
npm install include-html-webpack-loader
使用
这里是一个webpack配置文件中使用的实例介绍
rules: [
{
test: /\.(htm|html)/,
loader: 'include-html-webpack-loader'
}
]
在html中的代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
#include("./mypath/meta.html");
<title>模板插入demo</title>
</head>
<body>
#include("./mypath/insertTemplate1.html");
<p>模板插入demo页面内容</p>
#include("./mypath/insertTemplate2.html");
</body>
</html>
meta.html的代码为
<meta http-equiv="X-UA-Compatible" content="ie=edge">
insertTemplate1.html的代码为
<p>我是template1</p>
insertTemplate2.html的代码为
<p>我是template2</p>
编译结果为
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>模板插入demo</title>
</head>
<body>
<p>我是template1</p>
<p>模板插入demo页面内容</p>
<p>我是template2</p>
</body>
</html>