带撇号-cms 的静态图像答案

【问题标题】：Static images with apostrophe-cms带撇号-cms 的静态图像
【发布时间】：2019-04-10 08:37:10
【问题描述】：

我已经阅读了Guide for pushing assets，但对我没有帮助。我想更改代码上的下拉箭头。

<div class="filter-dropdown">
    <select class="filter-select select-borders-styles">
        <option value="newest">Newest First</option>
        <option value="oldest">Oldest First</option>
    </select>
</div>

这是更少的代码：

.filter-dropdown{
      [...]

        .filter-select{
            background: url('/modules/my-module/public/img/my-image.png') no-repeat 96% 0;
            overflow: hidden;
            width: 240px;
            padding: 20px;
            font-size: 19px;
            -webkit-appearance: none;  /*Removes default chrome and safari style*/
            -moz-appearance: none;   /*Removes default style Firefox*/
            color: #0167C2;  

            select{
                [..]
            }
        }

        .select-borders-styles{
           [...]
        }
}

我已经看到我必须在 /my-module/public/img/my-image.png 上添加图像，我已经添加了它，我在 less 文件中添加了具有正确路径的 url，但是它不起作用。

如果我在 de index.js 文件中添加 .less 这个代码：

    self.pushAssets = function() {
      superPushAssets();
      self.pushAsset('img', 'options_arrow', { when: 'always' });
    };

它显示此错误：

    /home/kalia/Escritorio/leo-newsletter/newsletter/node_modules/apostrophe/index.js:75
        throw err;
        ^
TypeError: Cannot read property 'fs' of undefined
    at Object.self.push (/home/kalia/Escritorio/leo-newsletter/newsletter/node_modules/apostrophe/lib/modules/apostrophe-assets/index.js:497:67)

谁能告诉我我做错了什么？谢谢。

【问题讨论】：

标签： apostrophe-cms

【解决方案1】：

pushAsset 方法适用于 CSS 文件和 javascript，而不是图像。因此该代码将不起作用。但是，你不需要它。它仅用于将内容组合成捆绑包以作为单个文件交付，这不是您的图像所需的功能。

如果您在lib/modules/mymodulename/public/my.png 有图片，那么您可以通过以下网址引用它：/modules/mymodulename/my.png

这是因为 Apostrophe 在启动时会将模块的 public 文件夹复制或符号链接到 /modules/...，具体取决于操作系统。

请注意，该 URL 不包含 /public 或 /lib。只需/modules/mymodulename/...。如果你愿意，你可以有一个images 子目录，在这种情况下它会是/modules/mymodulename/images/my.png（也就是说，文件名中之后 public 的所有内容都需要在URL 中） .

【讨论】：