添加 kramdown_enhancer 插件

.github/workflows/pr-preview.yml

@@ -10,8 +10,9 @@ concurrency:
   group: pr-preview
   cancel-in-progress: false
 env:
-  GITHUB_PR_NUMBER: ${{ github.event_name == 'issue_comment' && github.event.issue.number || github.event.pull_request.number }}
   JEKYLL_ENV: production
+  ENABLE_WEBP_AUTO_CONVERSION: "true"
+  GITHUB_PR_NUMBER: ${{ github.event_name == 'issue_comment' && github.event.issue.number || github.event.pull_request.number }}
 jobs:
   cache-refresh:
     if: ${{ !github.event.repository.fork && github.event_name == 'schedule' && github.event.schedule == '0 0 */6 * *' }}

Gemfile

@@ -32,5 +32,4 @@ gem "wdm", "0.2.0", :platforms => [:windows]
 gem "http_parser.rb", "0.8.0", :platforms => [:jruby]
 
 # plugin dependencies
-gem "nokogiri", "1.18.10"
-gem "addressable", "2.8.7"
+gem "webp-ffi", "0.4.0" if ENV["ENABLE_WEBP_AUTO_CONVERSION"] == "true" || ENV["DRONE"] == "true"

_config.yml

@@ -87,7 +87,7 @@ whitelist:
 # Serving
 # detach: false
 # port: 4000
-# host: 127.0.0.1
+host: localhost
 baseurl: ""
 # show_dir_listing: false
 

_plugins/kramdown_enhancer.rb

@@ -0,0 +1,173 @@
+begin
+  require "webp-ffi"
+rescue LoadError; end
+
+module KramdownEnhancer
+  class << self
+    def webp
+      @webp ||= {}
+    end
+
+    def file
+      @file ||= {}
+    end
+
+    def baseurl
+      @baseurl
+    end
+
+    def baseurl=(input)
+      @baseurl =
+        if input.is_a?(String) && !input.empty?
+          str = input.start_with?("/") ? input : "/#{input}"
+          str.chomp("/")
+        else
+          ""
+        end
+    end
+
+    def blockquote_types
+      @blockquote_types ||= {
+        :note => "notice--info",
+        :tip => "notice--success",
+        :important => "notice--primary",
+        :warning => "notice--warning",
+        :caution => "notice--danger",
+      }
+    end
+  end
+
+  class WebpFile < Jekyll::StaticFile
+    def write(dest)
+      true
+    end
+  end
+
+  module Html
+    def convert_a(el, indent)
+      if el.attr["href"].is_a?(String) && !el.options[:relative]
+        el.attr["href"] = relative_url(el.attr["href"])
+        el.options[:relative] = true
+      end
+
+      super
+    end
+
+    def convert_img(el, indent)
+      if el.attr["src"].is_a?(String) && !el.options[:relative]
+        src = el.attr["src"]
+        el.attr["src"] = relative_url(src)
+        el.options[:relative] = true
+
+        if KramdownEnhancer.webp[src] && !el.options[:webp] && !el.options[:picture]
+          webp_src = KramdownEnhancer.webp[src]
+          pic = Kramdown::Element.new(:html_element, "picture")
+          pic.children << Kramdown::Element.new(:html_element, "source", { "srcset" => relative_url(webp_src), "type" => "image/webp" })
+          el.options[:picture] = true
+          el.options[:webp] = true
+          pic.children << el
+          return convert_html_element(pic, indent)
+        end
+      end
+
+      super
+    end
+
+    def convert_blockquote(el, indent)
+      p = el.children.first
+      return super if p&.type != :p || p.children.empty?
+
+      first = p.children.first
+      return super unless first&.type == :text
+
+      text = first.value.downcase
+      KramdownEnhancer.blockquote_types.each do |type, class_name|
+        prefix = "[!#{type}]"
+        prefix_with_newline = "#{prefix}\n"
+
+        # case A: <p>[!NOTE]</p>
+        if text == prefix
+          el.attr["class"] = [el.attr["class"], class_name].compact.join(" ")
+          p.children.shift
+          break
+        # case B: <p>[!NOTE]\n some text</p>
+        elsif text.start_with?(prefix_with_newline)
+          el.attr["class"] = [el.attr["class"], class_name].compact.join(" ")
+          first.value = first.value[prefix_with_newline.length..-1] || ""
+          break
+        end
+      end
+
+      super
+    end
+
+    def convert_html_element(el, indent)
+      unless el.options[:relative]
+        if el.value == "a" && el.attr["href"].is_a?(String)
+          el.attr["href"] = relative_url(el.attr["href"])
+          el.options[:relative] = true
+        elsif el.value == "img" && el.attr["src"].is_a?(String)
+          src = el.attr["src"]
+          el.attr["src"] = relative_url(el.attr["src"])
+          el.options[:relative] = true
+
+          if KramdownEnhancer.webp[src] && !el.options[:webp] && !el.options[:picture]
+            webp_src = KramdownEnhancer.webp[src]
+            pic = Kramdown::Element.new(:html_element, "picture")
+            pic.children << Kramdown::Element.new(:html_element, "source", { "srcset" => relative_url(webp_src), "type" => "image/webp" })
+            el.options[:webp] = true
+            pic.children << el
+            return convert_html_element(pic, indent)
+          end
+        elsif el.value == "picture"
+          el.children.each do |child|
+            child.options[:picture] = true
+          end
+        end
+      end
+      super(el, indent)
+    end
+
+    private
+
+    def relative_url(input)
+      if input.is_a?(String) && input.start_with?("/")
+        input = input.start_with?("/") ? input : "/#{input}"
+        uri = Addressable::URI.parse(input)
+        if uri
+          if uri.path.length > 1
+            file = KramdownEnhancer.file[uri.path[1..]]
+            uri.path = file.url if file
+          end
+          uri.path = "#{KramdownEnhancer.baseurl}#{uri.path}"
+          return uri.to_s
+        end
+      end
+      input
+    end
+  end
+end
+
+Jekyll::Hooks.register :site, :post_read do |site|
+  KramdownEnhancer.baseurl = site.config["baseurl"]
+  webp_list = []
+  webp_enabled = defined?(WebP)
+  site.each_site_file do |file|
+    KramdownEnhancer.file[file.relative_path] = file
+    if file.is_a?(Jekyll::StaticFile)
+      url = "#{file.url}.webp"
+      source = "#{file.path}.webp"
+      destination = File.join(site.dest, url)
+      if File.exist?(source)
+        KramdownEnhancer.webp[file.url] = url
+      elsif webp_enabled && %w[.png .jpg .jpeg .tif .tiff].include?(file.extname.downcase)
+        FileUtils.mkdir_p(File.dirname(destination))
+        WebP.encode(file.path, destination)
+        webp_list.push(KramdownEnhancer::WebpFile.new(site, site.dest, File.dirname(url), File.basename(url)))
+        KramdownEnhancer.webp[file.url] = url
+      end
+    end
+  end
+  site.static_files.concat(webp_list)
+  Kramdown::Converter::Html.prepend(KramdownEnhancer::Html)
+end

index.md

@@ -23,7 +23,7 @@ title: 新手导航
 {% for group in site.data.navigation.docs -%}
 ## {{ group.title }}
 {% for item in group.children -%}
-1. [{{ item.title }}]({{ item.url | relative_url }})
+1. [{{ item.title }}]({{ item.url }})
 {%- if item.description %}\
    {{ item.description }}
 {%- endif %}