利用gulp实现将css文件加入到HTML的style标签内部

由于不能使用link标签
想实现类似于模块加载的效果如下图所示

clipboard.png

但是gulp-file-include插件加载css模块会报错,有没有大神有好的解决办法

阅读 3.2k
2 个回答

可以使用 gulp-inject 来 实现楼主的 想法

我先到一种,就是你在html文件创建一个<style>锚,然后通过gulp与through之间的配合,得到css问价你的样式字符串,然后在html中的锚通过正则替换添加样式字符串;
gulp.task('cssInsert',function (cb) {

gulp.src('./css/common.min.css')
    .pipe(through.obj(function(file,enc,cb){
        str = file.contents.toString(); //得到css中的样式并转化成字符串,保存在一个全局变量中
        cb();}))

});

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题