jekyll-vite 0.0.1

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 7db450fb50d7d77214596d9f5a78518b4618c2100118502e2d4178cdd242e0ad
+  data.tar.gz: 74dc9598aa9b76bc755c4c1d0513fb6d9ebc50c22c738768e31280146b469d6d
+SHA512:
+  metadata.gz: '09b2ee91572039d136a1db1b3aa4f0cc4f21bd4560a1d5d37d8d548a3176fa4c72b04b479e7f857e7aca2d8e4fec91dd70dce16086635ad905b1488a4ec9173a'
+  data.tar.gz: a6ed6af1378fb9bd128ab45f5f0eea48db46a8dc4f38bdde58f17e1515f894473e451cfc29aa323b470faf137ccbd786106b5d4530f84507cd0c285a43dece8a

data/CHANGELOG.md

@@ -0,0 +1,14 @@
+## 0.0.1 (2021-07-02)
+
+### Features
+
+* Build vite assets when generating site and preserve assets correctly ([0b9a138](https://github.com/ElMassimo/vite_ruby/commit/0b9a138393a00c96119e42d5a59ac71539d00912))
+* Ignore Vite dir when the dev server is active, add the last build ([548a47f](https://github.com/ElMassimo/vite_ruby/commit/548a47f8bbb6f22820083d22d4628d445149ba46))
+* Implement a WEBrick proxy servlet for Jekyll ([b5afe03](https://github.com/ElMassimo/vite_ruby/commit/b5afe03b763235c23d9eaf940086d6ddb19399dc))
+* Implement liquid tags to render script and stylesheet tags ([4cbb679](https://github.com/ElMassimo/vite_ruby/commit/4cbb679af2625f31954c56b7cda032c896d7e127))
+* Read mode from JEKYLL_ENV ([acd7181](https://github.com/ElMassimo/vite_ruby/commit/acd7181c507cd1971f056462f240dec0071acf3b))
+* Serve files from the cache when the Vite dev server is down ([d695718](https://github.com/ElMassimo/vite_ruby/commit/d695718b1805211aa8b63c81d140b7212d2347f5))
+* Track dependencies on entrypoints ([5b8c413](https://github.com/ElMassimo/vite_ruby/commit/5b8c41336085e24568750bcbc77192f498488f46))
+
+
+

data/LICENSE.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2020 Maximo Mussini
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

data/README.md

@@ -0,0 +1,130 @@
+<h1 align="center">
+  <a href="https://vite-ruby.netlify.app/">
+    <img src="https://raw.githubusercontent.com/ElMassimo/vite_ruby/main/docs/public/logo.svg" width="120px"/>
+  </a>
+
+  <br>
+
+  <a href="https://vite-ruby.netlify.app/">
+    Jekyll ➕ Vite.js
+  </a>
+
+  <br>
+
+  <p align="center">
+    <!-- <a href="https://github.com/ElMassimo/jekyll-vite/actions">
+      <img alt="Build Status" src="https://github.com/ElMassimo/jekyll-vite/workflows/build/badge.svg"/>
+    </a> -->
+ <!--    <a href="https://codeclimate.com/github/ElMassimo/jekyll-vite">
+      <img alt="Maintainability" src="https://codeclimate.com/github/ElMassimo/jekyll-vite/badges/gpa.svg"/>
+    </a>
+    <a href="https://codeclimate.com/github/ElMassimo/jekyll-vite">
+      <img alt="Test Coverage" src="https://codeclimate.com/github/ElMassimo/jekyll-vite/badges/coverage.svg"/> -->
+    </a>
+    <a href="https://rubygems.org/gems/jekyll-vite">
+      <img alt="Gem Version" src="https://img.shields.io/gem/v/jekyll-vite.svg?colorB=e9573f"/>
+    </a>
+    <a href="https://github.com/ElMassimo/jekyll-vite/blob/master/LICENSE.txt">
+      <img alt="License" src="https://img.shields.io/badge/license-MIT-428F7E.svg"/>
+    </a>
+  </p>
+</h1>
+
+[website]: https://github.com/ElMassimo/vite-ruby
+[website]: https://vite-ruby.netlify.app/
+[jekyll]: https://jekyllrb.com/
+[configuration reference]: https://vite-ruby.netlify.app/config/
+[features]: https://vite-ruby.netlify.app/guide/introduction.html
+[guides]: https://vite-ruby.netlify.app/guide/
+[config]: https://vite-ruby.netlify.app/config/
+[vite.js]: http://vitejs.dev/
+[Issues]: https://github.com/ElMassimo/jekyll-vite/issues?q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc
+[Discussions]: https://github.com/ElMassimo/jekyll-vite/discussions
+[no bundling]: https://vitejs.dev/guide/why.html#the-problems
+[bundling]: https://vitejs.dev/guide/why.html#why-bundle-for-production
+[rollup.js]: https://rollupjs.org
+[esbuild]: https://esbuild.github.io/
+
+Use [Vite.js] in [Jekyll] and enjoy a modern assets pipeline! ⚡️
+
+<small>_This integration is powered by [__Vite Ruby__][Vite Ruby]_.</small>
+
+## Features ⚡️
+
+- ⚡️ Blazing fast hot reload
+- 📦 Zero-config builds
+- 🎨 Use your favorite languages/preprocessors/utilities (TypeScript, Tailwind CSS, etc.)
+
+## Why Vite? 🤔
+
+[Jekyll] does not have an extensible asset pipeline, which limits the amount of
+integrations that exist for different languages and preprocessors. By default,
+assets are not fingerprinted which is problematic for caching.
+
+[Vite.js] has an extensible architecture and is built on top of [rollup.js], and as
+a result there is an active ecosystem of plugins and tooling available. In addition,
+it's [no bundling] design provides a very fluid authoring experience—changes to
+your assets are reflected instantly in your browser.
+
+## Installation 💿
+
+Add this line to your site's Gemfile:
+
+```ruby
+gem 'jekyll-vite'
+```
+
+Then, run:
+
+```bash
+bundle install
+bundle exec vite install
+```
+
+This will install the plugin in `_config.yml`, and generate a sample setup in
+`_layouts/default.html` (if it exists).
+
+```yml
+plugins:
+  - jekyll/vite
+```
+
+```html
+<head>
+  <!-- meta tags, etc -->
+  {% vite_client_tag %}
+  {% vite_javascript_tag application %}
+  {% vite_stylesheet_tag styles.scss %}
+</head>
+```
+
+Additional installation instructions are available in the [documentation website][website].
+
+## Getting Started 💻
+
+Run <kbd>bin/vite dev</kbd> to start the Vite development server, and then
+restart your Jekyll server with <kbd>bin/jekyll serve</kbd>.
+
+Visit any page and you should see a printed console output: `Vite ⚡️ Ruby`.
+
+For more [guides] and a full [configuration reference], check the [documentation website][website].
+
+_A new section for Jekyll is coming soon!_
+
+## Contact ✉️
+
+Please use [Issues] to report bugs you find, and [Discussions] to make feature requests or get help.
+
+Don't hesitate to _⭐️ star the project_ if you find it useful!
+
+Using it in your site? Always love to hear about it! 😃
+
+## Acknowledgements
+
+- [Jekyll] — Even after all this time, it's still a great static site generator.
+- [Vite.js] — Frontend tooling with a focus on the developer experience.
+
+## License
+
+The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
+

data/lib/jekyll/vite.rb

@@ -0,0 +1,16 @@
+# frozen_string_literal: true
+
+require 'jekyll'
+require 'vite_ruby'
+
+require 'jekyll/vite/version'
+require 'jekyll/vite/config'
+require 'jekyll/vite/tags'
+require 'jekyll/vite/generator'
+require 'jekyll/vite/proxy'
+
+Jekyll::Hooks.register(:site, :after_init) do |site|
+  if site.config['serving'] && ViteRuby.instance.dev_server_running?
+    site.config['exclude'] << ViteRuby.config.source_code_dir
+  end
+end

data/lib/jekyll/vite/config.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+module Jekyll::Vite::Config
+  # Override: Provide default values for a typical Jekyll site.
+  def config_defaults(**opts)
+    require 'jekyll'
+    config = Jekyll.configuration
+    super(**opts, mode: Jekyll.env).tap do |defaults|
+      defaults['public_dir'] = config['cache_dir']
+      defaults['build_cache_dir'] = File.join(config['cache_dir'], 'vite-build')
+    end
+  end
+end
+
+ViteRuby::Config.singleton_class.prepend(Jekyll::Vite::Config)

data/lib/jekyll/vite/generator.rb

@@ -0,0 +1,38 @@
+# frozen_string_literal: true
+
+# Internal: Adds all assets generated by Vite to the static_files list, so
+# that they are copied over to the built site.
+class Jekyll::Vite::Generator < Jekyll::Generator
+  safe true
+  priority :highest
+
+  class ViteAssetFile < Jekyll::StaticFile
+    # Override: Copy to the configured public_output_dir
+    def cleaned_relative_path
+      super.sub(
+        ViteRuby.config.build_output_dir.relative_path_from(@site.source).to_s,
+        ViteRuby.config.public_output_dir,
+      )
+    end
+  end
+
+  # Internal: Set the mode based on which command was run.
+  # Builds assets with Vite only if `jekyll build` was run.
+  def generate(site)
+    serving = site.config['serving']
+    ENV['JEKYLL_ENV'] ||= serving ? 'development' : 'production'
+    generate_vite_build(site) unless serving
+  end
+
+  # Internal: Build all assets with Vite and add them to the site's static files.
+  def generate_vite_build(site)
+    ViteRuby.commands.build_from_task
+    assets_dir = ViteRuby.config.build_output_dir.relative_path_from(site.source)
+    files = Dir.chdir(ViteRuby.config.build_output_dir.to_s) {
+      Dir.glob('**/*').select { |f| File.file?(f) }
+    }
+    site.static_files.concat(files.map { |file|
+      ViteAssetFile.new(site, site.source, assets_dir, file)
+    })
+  end
+end

data/lib/jekyll/vite/installation.rb

@@ -0,0 +1,30 @@
+# frozen_string_literal: true
+
+require 'jekyll/vite'
+
+# Internal: Extends the base installation script from Vite Ruby to work for a
+# typical Jekyll site.
+module Jekyll::Vite::Installation
+  JEKYLL_TEMPLATES = Pathname.new(File.expand_path('../../../templates', __dir__))
+
+  # Override: Setup a typical Jekyll site to use Vite.
+  def setup_app_files
+    cp JEKYLL_TEMPLATES.join('config/jekyll-vite.json'), config.config_path
+    append root.join('Rakefile'), <<~RAKE
+      require 'jekyll/vite'
+      ViteRuby.install_tasks
+    RAKE
+  end
+
+  # Override: Inject the vite client and sample script to the default HTML template.
+  def install_sample_files
+    super
+    inject_line_after root.join('_config.yml'), 'plugins:', '  - jekyll/vite'
+    inject_line_before root.join('_layouts/default.html'), '</head>', <<-HTML.chomp("\n")
+    {% vite_client_tag %}
+    {% vite_javascript_tag application %}
+    HTML
+  end
+end
+
+ViteRuby::CLI::Install.prepend(Jekyll::Vite::Installation)

data/lib/jekyll/vite/proxy.rb

@@ -0,0 +1,51 @@
+# frozen_string_literal: true
+
+require 'rack'
+require 'webrick'
+require 'jekyll/commands/serve/servlet'
+
+# Internal: Extend the default servlet to add a Rack-based proxy in order to
+# forward asset requests to the Vite.js development server.
+module Jekyll::Vite::Proxy
+  # Internal: Used to detect proxied requests since it's not a valid status code.
+  STATUS_SERVE_ORIGINAL = 0o07
+
+  def initialize(server, *args)
+    @server = server
+    super
+  end
+
+  # Override: Serve compiled Vite assets from the temporary folder as needed.
+  def set_filename(req, res)
+    original_root = @root.dup
+    if req.path_info.start_with?("/#{ ViteRuby.config.public_output_dir }/")
+      @root = ViteRuby.config.root.join(ViteRuby.config.public_dir)
+    end
+    super.tap { @root = original_root }
+  end
+
+  # Override: Detect the special status set by the Proxy Servlet and use the
+  # default Jekyll response instead.
+  def service(req, res)
+    proxy_servlet.service(req, res)
+    super if res.status == STATUS_SERVE_ORIGINAL
+  end
+
+private
+
+  # Internal: A WEBRick servlet that uses a Rack proxy internally.
+  def proxy_servlet
+    @proxy_servlet ||= begin
+      # Called by the proxy if a request shouldn't be served by Vite.
+      app = ->(_env) { [STATUS_SERVE_ORIGINAL, {}, []] }
+
+      # Initialize the proxy which is a Rack app.
+      proxy = ViteRuby::DevServerProxy.new(app)
+
+      # Return a servlet compliant with WEBrick.
+      Rack::Handler::WEBrick.new(@server, proxy)
+    end
+  end
+end
+
+Jekyll::Commands::Serve::Servlet.prepend Jekyll::Vite::Proxy

data/lib/jekyll/vite/tags.rb

@@ -0,0 +1,154 @@
+# frozen_string_literal: true
+
+# Internal: Base class for all tags.
+class Jekyll::Vite::Tag < Jekyll::Tags::IncludeTag
+  include Jekyll::Filters::URLFilters
+
+  # Override: Set the context to make the site available in the URLFilters.
+  def render(context)
+    @context = context
+    @params = @params.is_a?(String) ? parse_params(context).transform_keys(&:to_sym) : @params || {}
+    if @file = render_variable(@file)
+      validate_file_name(@file)
+      track_file_dependency(@file)
+    end
+    block_given? ? yield : raise(NotImplementedError, "Implement render in #{ self.class.name }")
+  end
+
+  # Override: Modified version that can resolve recursive references.
+  def render_variable(variable)
+    variable = Liquid::Template.parse(variable).render!(@context) while VARIABLE_SYNTAX =~ variable
+    variable
+  end
+
+protected
+
+  # Internal: Resolves the path for the specified Vite asset.
+  def vite_asset_path(name, **options)
+    vite_manifest.path_for(name, **options)
+  end
+
+  # Internal: Returns the current manifest loaded by Vite Ruby.
+  def vite_manifest
+    ViteRuby.instance.manifest
+  end
+
+  # Internal: Renders HTML attributes inside a tag.
+  def stringify_attrs(**attrs)
+    attrs.map { |key, value| %(#{ key }="#{ value }") }.join(' ')
+  end
+
+  # Internal: Renders an HTML tag of the specified type.
+  def tag(type, **attrs)
+    self_closing = type != :script
+    %i[href src].each { |key| attrs[key] = relative_url(attrs[key]) if attrs.key?(key) }
+    ["<#{ type } ", stringify_attrs(**attrs), self_closing ? '/>' : "></#{ type }>"].join
+  end
+
+  # Internal: Renders HTML link tags.
+  def link_tags(sources, **attrs)
+    sources.map { |href| tag(:link, href: href, **attrs) }.join("\n")
+  end
+
+  # Internal: Renders HTML script tags.
+  def script_tags(sources, **attrs)
+    sources.map { |src| tag(:script, src: src, **attrs) }.join("\n")
+  end
+
+  # Internal: Adds entrypoint files managed by Vite as a dependency in the
+  # renegerator in order to support --incremental mode.
+  def track_file_dependency(name)
+    site = @context.registers[:site]
+    path = site.in_source_dir(File.join(ViteRuby.config.source_code_dir, ViteRuby.config.entrypoints_dir, name))
+
+    ['', '.css', '.js', '.ts'].each do |ext|
+      if File.file?(asset_path = "#{ path }#{ ext }")
+        return [asset_path, last_build_metadata_path].each do |filename|
+          add_include_to_dependency(site, filename, @context)
+        end
+      end
+    end
+  end
+
+  # Internal: Adding the last build metadata file as a dependency ensures
+  # all pages using Vite assets are regenerated if a Vite build is triggered.
+  def last_build_metadata_path
+    ViteRuby.instance.builder.send(:last_build_path)
+  end
+end
+
+# Public: Renders a path to a Vite asset.
+class Jekyll::Vite::AssetPathTag < Jekyll::Vite::Tag
+  def render(context)
+    super { vite_asset_path(@file, @params) }
+  end
+end
+
+# Public: Renders the @vite/client script tag.
+class Jekyll::Vite::ClientTag < Jekyll::Vite::Tag
+  def render(context)
+    return unless src = vite_manifest.vite_client_src
+
+    super {
+      tag :script, src: src, type: 'module'
+    }
+  end
+
+  def syntax_example
+    "{% #{ @tag_name } %}"
+  end
+end
+
+# Public: Renders a <link> tag for the specified stylesheet.
+class Jekyll::Vite::StylesheetTag < Jekyll::Vite::Tag
+  def render(context)
+    super {
+      tag :link, **{
+        rel: 'stylesheet',
+        href: vite_asset_path(@file, type: :stylesheet),
+        media: 'screen',
+      }.merge(@params)
+    }
+  end
+
+  def syntax_example
+    "{% #{ @tag_name } application.scss media='screen, projection' %}"
+  end
+end
+
+# Public: Renders a <script> tag for the specified file.
+class Jekyll::Vite::JavascriptTag < Jekyll::Vite::Tag
+  def render(context)
+    super {
+      media = @params.delete(:media) || 'screen'
+      crossorigin = @params.delete(:crossorigin) || 'anonymous'
+      type = @params.delete(:type) || 'module'
+      asset_type = @tag_name == 'vite_typescript_tag' ? :typescript : :javascript
+
+      entries = vite_manifest.resolve_entries(@file, type: asset_type)
+
+      [
+        script_tags(entries.fetch(:scripts), crossorigin: crossorigin, type: type, **@params),
+        link_tags(entries.fetch(:imports), rel: 'modulepreload', as: 'script', crossorigin: crossorigin, **@params),
+        link_tags(entries.fetch(:stylesheets), rel: 'stylesheet', media: media, crossorigin: crossorigin, **@params),
+      ].join("\n")
+    }
+  end
+
+  def syntax_example
+    "{% #{ @tag_name } application %}"
+  end
+end
+
+# Recreating tag helpers in Jekyll requires considerably more code than in web
+# frameworks, since Liquid does not provide HTML helpers and parsing parameters
+# is more complex than a Ruby method invocation.
+{
+  'vite_asset_path' => Jekyll::Vite::AssetPathTag,
+  'vite_client_tag' => Jekyll::Vite::ClientTag,
+  'vite_javascript_tag' => Jekyll::Vite::JavascriptTag,
+  'vite_typescript_tag' => Jekyll::Vite::JavascriptTag,
+  'vite_stylesheet_tag' => Jekyll::Vite::StylesheetTag,
+}.each do |name, tag|
+  Liquid::Template.register_tag(name, tag)
+end

data/lib/jekyll/vite/version.rb

@@ -0,0 +1,7 @@
+# frozen_string_literal: true
+
+module Jekyll
+  module Vite
+    VERSION = '0.0.1'
+  end
+end

data/templates/config/jekyll-vite.json

@@ -0,0 +1,15 @@
+{
+  "all": {
+    "sourceCodeDir": "_frontend",
+    "watchAdditionalPaths": []
+  },
+  "development": {
+    "autoBuild": true,
+    "publicOutputDir": "vite-dev",
+    "port": 3036
+  },
+  "test": {
+    "autoBuild": true,
+    "publicOutputDir": "vite-test"
+  }
+}

metadata

@@ -0,0 +1,110 @@
+--- !ruby/object:Gem::Specification
+name: jekyll-vite
+version: !ruby/object:Gem::Version
+  version: 0.0.1
+platform: ruby
+authors:
+- Máximo Mussini
+autorequire:
+bindir: bin
+cert_chain: []
+date: 2021-07-02 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: jekyll
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '3'
+    - - "<"
+      - !ruby/object:Gem::Version
+        version: '5'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '3'
+    - - "<"
+      - !ruby/object:Gem::Version
+        version: '5'
+- !ruby/object:Gem::Dependency
+  name: vite_ruby
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 1.2.14
+    - - "<"
+      - !ruby/object:Gem::Version
+        version: '2'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 1.2.14
+    - - "<"
+      - !ruby/object:Gem::Version
+        version: '2'
+- !ruby/object:Gem::Dependency
+  name: rake
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+description:
+email:
+- maximomussini@gmail.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- CHANGELOG.md
+- LICENSE.txt
+- README.md
+- lib/jekyll/vite.rb
+- lib/jekyll/vite/config.rb
+- lib/jekyll/vite/generator.rb
+- lib/jekyll/vite/installation.rb
+- lib/jekyll/vite/proxy.rb
+- lib/jekyll/vite/tags.rb
+- lib/jekyll/vite/version.rb
+- templates/config/jekyll-vite.json
+homepage: https://github.com/ElMassimo/jekyll-vite
+licenses:
+- MIT
+metadata:
+  source_code_uri: https://github.com/ElMassimo/jekyll-vite/tree/v0.0.1
+  changelog_uri: https://github.com/ElMassimo/jekyll-vite/blob/v0.0.1/CHANGELOG.md
+post_install_message:
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '2.4'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubygems_version: 3.1.4
+signing_key:
+specification_version: 4
+summary: Use Vite.js in Jekyll and enjoy a modern assets pipeline
+test_files: []