Question

我有一个像这样的文件夹结构：

src
   assets
       scss
           layout
               layout.scss
            pages
                index.scss
   layout
       site-header.html
       site-footer.html
    pages
        index.html
index.html
css
    layout.css
    index.css
js

/scss文件夹中的sass文件被编译到/css文件夹。

我在/css/layout.css文件中关联了/src/layout/site-header.html。

/css/index.css链接在/src/pages/index.html文件中。

我想使用某些东西（gulp插件）在根文件夹中生成/index.html。

此文件由/src/layout/site-header.html，/src/pages/index.html，/src/layout/site-footer.html组成，最重要的是，将/css/index.css链接放在文件的head部分。

我该怎么做？我查找了gulp插件，但我只找到了https://www.npmjs.com/package/gulp-file-include，它无法将css链接放在html文件的head部分中。：'（

提前致谢。：）

如果标题不合适，请帮助重新标注标题。：）

Answer 1

：D我发现我可以使用gulp-file-include来完成工作：D

在/src/pages/index.html我可以将json格式的视图css传递到布局文件中，如下所示：

@@include('../layouts/site-header.html', {"viewCSS":"/css/pages/index.css"})

然后在/src/layout/site-header.html我能做到：

<link rel="stylesheet" href="@@viewCSS">

输出：

<link rel="stylesheet" href="/css/pages/index.css">

：）

如何连接html文件并使用gulp插件注入head部分的css链接？

1 个答案: