使用 webpack / react 未在生产中应用的打印样式答案

【问题标题】：Print styles not applied in production with webpack / react使用 webpack / react 未在生产中应用的打印样式
【发布时间】：2019-12-19 04:37:42
【问题描述】：

我正在运行一个带有 rails 的堆栈，在 rails 和 webpack 上做出反应。我能够在开发中成功使用打印样式，但是在部署到生产环境时，似乎没有任何打印样式适用。

开发中

在生产中。

仅在生产中出现。

可能会转向类似于其他页面的 PDF。

样式存在于生产中，没有被正确应用？

在生产中，它能够找到媒体打印样式。

生产风格 @media print{.App-module__d-print-active-pdf___2FlpM{background-color:#fff;height:100%;width:100%;position:fixed;top:0;left:0;margin:0;padding: 15px;font-size:14px;line-height:18px}}

在生产中。

更新：

从 assets 文件夹中正确应用打印样式。

但是它们不是从应用程序包中应用的。

【问题讨论】：

标签： ruby-on-rails reactjs webpack printing

【解决方案1】：

如果使用webpacker，请务必在样式标签上设置media 类型：

所以而不是：

<%= stylesheet_packs_with_chunks_tag 'styles-bundle' %>

你会想要的

<%= stylesheet_packs_with_chunks_tag 'styles-bundle', media: 'all' %>

如果您想了解更多信息，来源可能会有所帮助：

【讨论】：