如何使 Eleventy 在输出中包含 CSS 和图像等资源？

Question

我是第一次尝试 110 个静态站点生成器。每当我构建时，内容文件都会生成得很好，但没有任何资产（CSS、JS、图像等）最终出现在输出目录中 - 出现的只是 HTML，其中资产的链接已损坏。

现在我使用默认的目录结构：

• 项目/
  • _包括/
  • _地点/
  • CSS/
  • 索引.html
  • 节点模块/
  • 包锁.json
  • 包.json

我尝试像上面一样构建它，并且尝试将 css 放入 _includes 目录中。我还尝试将 css 放入输出文件夹 (_site/) 中，这有效，但必须在输出中编辑源文件似乎是错误的。

我到处搜索过，但我发现的教程都没有涉及包括 CSS 之类的内容。

有没有一种正确的方法可以解决我所缺少的问题，或者您真的应该在源文件和输出中编辑文件吗？

Answer 1

解决方案是使用直通文件复制。我之前没有研究过这一点，因为作为一个初学者，它似乎是一个高级主题，而且我认为像将 CSS 放入输出目录这样基本的东西应该是默认打开的一些简单设置。一旦你知道如何去做，这很简单，但由于某种原因它不是默认的。

这是解决我的问题的代码。“_src/assets”是相对于项目根目录保存所有 CSS 和图像的文件夹。

module.exports = function(eleventyConfig) {

    eleventyConfig.addPassthroughCopy("_src/assets");

    return {
        dir: {
            includes: "_templates",
            input: "_src",
            output: "_site"
        }
    };

};