gulp-inject如何解决同目录问题?

发布于 2022-09-04 08:47:00 字数 1169 浏览 13 评论 0

愿景:

-src
    -tpl
        -tplA
            -index.html
            -index.css
        -tplB
            -index.html
            -index.css
            
// Example - tplA            

// index.html
<!-- inject:style:css -->
<!-- endinject -->
<p>这是正文</p>

// index.css
.test{color:red}

gulp之后变成:

-dest
    -tpl
         -tplA
             -index.html(injected index.css)   
         -tplB
             -index.html(injected index.css)
             
// Example - tplA
// index.html
.test{color:red} /*这是inject的css内容*/

<p>这是正文</p>

// 同理tplB、tplC、tplD...也一样

遇到的问题

gulp.task('inject', function(){
    gulp.src('./src/**/*.html')
            .pipe(inject(gulp.src('./src/**/*.css'), { // 问题行
            starttag: '<!-- inject:style:{{ext}} -->',
            transform: function(filePath, file) {
                return "<style>\n" + file.contents.toString('utf8') + "\n</style>";
            }
        }))
        .pipe(gulp.dest('./dest'))
});

如果问题行处,src设置为具体的css路径,则可以。但是不能实现自动识别html所在的目录下,对应名字的css文件,请问有什么方法吗?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文