代码拉取完成，页面将自动刷新
#gulp-html-resource
前端UI开发中，我们经常遇到开发引用资源路径和打包后的路径不在同一个目录，并且css，js都会进行压缩构建。 在页面测试过程，会进常手动更改路径（既麻烦又容易出错~）。
现在 就算是静态html，我们同样可以使用模板化来构建我们的UI页面啦~~
需要一个resConfig.js配置文件
//调试模式（dev:开发模式，pro:生产模式）
var development="pro";
module.exports=function(){
if(development=="dev"){
return{
suffix:"",//css,js文件后缀
output:"html",//模板输出目录
template:"template/**/*.html",//模板目录
css:"dev/stylesheets",//开发版css目录
js:"dev/javascripts",//开发版js目录
image:"dev/images"//开发版图片目录
}
}
if(development=="pro"){
return{
suffix:".min",
output:"html",
template:"template/**/*.html",
css:"build/stylesheets",
js:"build/javascripts",
image:"build/images"
}
}
}
配置需要的模板： 例如：meta.html
<link rel="stylesheet" href="../<%=cssPath%>/main<%=suffix%>.css" >
<script src="../<%=jsPath%>/main<%=suffix%>.js"></script>
index.html
<!DOCTYPE html>
<html>
<head>
#include('./template/common/meta.html')
<link rel="stylesheet" href="../<%=cssPath%>/test<%=suffix%>.css" >
<script src="../<%=jsPath%>/test<%=suffix%>.js"></script>
</head>
<body>
<img src="../<%=imgPath%>/1.png" />
</body>
</html>
输出后的html：
开发模式：
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="../dev/stylesheets/main.css" >
<script src="../dev/javascripts/main.js"></script>
<link rel="stylesheet" href="../dev/stylesheets/test.css" >
<script src="../dev/javascripts/test.js"></script>
</head>
<body>
<img src="../dev/images/1.png" />
</body>
</html>
生产模式：
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="../build/stylesheets/main.min.css" >
<script src="../build/javascripts/main.min.js"></script>
<link rel="stylesheet" href="../build/stylesheets/test.min.css" >
<script src="../build/javascripts/test.min.js"></script>
</head>
<body>
<img src="../build/images/1.png" />
</body>
</html>
在gulpfile.js中配置：
var gulp=require("gulp"),
templateToHtml=require("./lib/index");
gulp.task("templateToHtml",function(){
var resource=new templateToHtml();
});
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。
1. 开源生态
2. 协作、人、软件
3. 评估模型