使用 Preact Build 时如何保留模板 HTML 中的样式标签？

Question

我正在使用 Preact 3.0。我在模板 index.html 文件中有几个 style 标签。目的是在构建过程中保留它。例如，

<style id="keep-this-tag">
  some-styles-that-should-not-be-put-in-style.css-file
</style>

Answer 1

您需要标签本身随处可见吗？

如果是这样，只需使用以下配置，或添加到您现有的：

// preact.config.js

export default (config, env, helpers) => {
    const critters = helpers.getPluginsByName(config, 'Critters')[0];
    if (critters) {
        critters.plugin.options.mergeStylesheets = false;
    }
}

Critters 用于关键 CSS 内联，默认情况下，它将您的样式标签合并在一起。虽然很容易被禁用，但希望这对您有所帮助。

编辑：禁用预渲染后，Critters 将删除所有 CSS，因为它们都被认为是“未使用的”。要禁用 Critters，您可以使用 --no-inline-css 标志，即 preact build --no-inline-css.

你确实在内联上失败了，但没有办法解决它。

使用 Preact Build 时如何保留模板 HTML 中的样式标签？

How to keep the style tag from template HTML when using Preact Build?

css

webpack

preact