Jekyll 插件使用 FastImage returns 本地图像错误

Question

我正在尝试编写一个 Jekyll 插件来计算图像的纵横比并将其包装在该大小的容器中以避免加载页面时回流。我正在使用 fastimage 来计算比率，现在它看起来像这样：

require 'fastimage'

module Jekyll
  class PlaceholderImageTag < Liquid::Tag

    def initialize(tag_name, markup, tokens)
      super
      @image_url = 'image_url'
    end

    def render(context)
      @index = Liquid::Template.parse("{{ forloop.index | minus: 1 }}").render(context)
      @base_url = Liquid::Template.parse("{{ site.#{@image_url} }}").render(context)
      @src = Liquid::Template.parse("{{ page.images[#{@index}].image }}").render(context)

      @size = FastImage.size("http://localhost:4000/public/images/"+@src)
      @ratio = (@size[1]*1.0/@size[0])*100

      placeholder = "<div class='placeholder' style='padding-bottom:#{@ratio}%'>"
      placeholder += "<img src=\"#{@base_url}\/#{@src}\"/>"
      placeholder += "</div>"
    end
  end
end

Liquid::Template.register_tag('placeholder_img', Jekyll::PlaceholderImageTag)

问题是，当我在本地 (localhost:4000) FastImage returns 构建我的网站时出现错误 - 如果我将 FastImage 指向不同的本地服务器（如 MAMP）或我的产品 URL它工作得很好，但是使用 jekyll 服务器会失败。

是否可以在不指向单独服务器的情况下让 FastImage 工作？

Answer 1

我发现如果在启动 jekyll 之前站点源代码中不存在 placeholder_img 标签，我可以运行一个类似的插件就好了。

所以问题是，当您启动 jekyll 时，它会在服务器运行ning 之前尝试构建静态文件 ，因此图像无法在那个时刻，被FastImage获取。

尝试像这样启动 jekyll

jekyll serve --skip-initial-build

一旦任何文件被更改，jekyll 将成功地重新生成它并提供它。

如果在 jekyll 未运行ning 时更改了某些文件，您可能需要修改这些文件以触发重新生成，或者只是运行一旦服务器已经 [=]jekyll 构建24=]宁.

Jekyll 插件使用 FastImage returns 本地图像错误

Jekyll plugin using FastImage returns error with local images

ruby

jekyll

jekyll-extensions