jetpacker 0.1.0 → 0.2.0

data/lib/webpacker/dev_server.rb

@@ -0,0 +1,66 @@
+class Webpacker::DevServer
+  DEFAULT_ENV_PREFIX = "WEBPACKER_DEV_SERVER".freeze
+
+  # Configure dev server connection timeout (in seconds), default: 0.01
+  # Webpacker.dev_server.connect_timeout = 1
+  cattr_accessor(:connect_timeout) { 0.01 }
+
+  attr_reader :config
+
+  def initialize(config)
+    @config = config
+  end
+
+  def running?
+    if config.dev_server.present?
+      Socket.tcp(host, port, connect_timeout: connect_timeout).close
+      true
+    else
+      false
+    end
+  rescue
+    false
+  end
+
+  def host
+    fetch(:host)
+  end
+
+  def port
+    fetch(:port)
+  end
+
+  def https?
+    case fetch(:https)
+    when true, "true", Hash
+      true
+    else
+      false
+    end
+  end
+
+  def protocol
+    https? ? "https" : "http"
+  end
+
+  def host_with_port
+    "#{host}:#{port}"
+  end
+
+  def pretty?
+    fetch(:pretty)
+  end
+
+  def env_prefix
+    config.dev_server.fetch(:env_prefix, DEFAULT_ENV_PREFIX)
+  end
+
+  private
+    def fetch(key)
+      ENV["#{env_prefix}_#{key.upcase}"] || config.dev_server.fetch(key, defaults[key])
+    end
+
+    def defaults
+      config.send(:defaults)[:dev_server] || {}
+    end
+end

data/lib/webpacker/dev_server_proxy.rb

@@ -0,0 +1,31 @@
+require "rack/proxy"
+
+class Webpacker::DevServerProxy < Rack::Proxy
+  delegate :config, :dev_server, to: :@webpacker
+
+  def initialize(app = nil, opts = {})
+    @webpacker = opts.delete(:webpacker) || Webpacker.instance
+    opts[:streaming] = false if Jets.env.test? && !opts.key?(:streaming)
+    super
+  end
+
+  def perform_request(env)
+    if env["PATH_INFO"].start_with?("/#{public_output_uri_path}") && dev_server.running?
+      env["HTTP_HOST"] = env["HTTP_X_FORWARDED_HOST"] = env["HTTP_X_FORWARDED_SERVER"] = dev_server.host_with_port
+      env["HTTP_X_FORWARDED_PROTO"] = env["HTTP_X_FORWARDED_SCHEME"] = dev_server.protocol
+      unless dev_server.https?
+        env["HTTPS"] = env["HTTP_X_FORWARDED_SSL"] = "off"
+      end
+      env["SCRIPT_NAME"] = ""
+
+      super(env)
+    else
+      @app.call(env)
+    end
+  end
+
+  private
+    def public_output_uri_path
+      config.public_output_path.relative_path_from(config.public_path).to_s + "/"
+    end
+end

data/lib/webpacker/dev_server_runner.rb

@@ -0,0 +1,72 @@
+require "shellwords"
+require "socket"
+require "webpacker/configuration"
+require "webpacker/dev_server"
+require "webpacker/runner"
+
+module Webpacker
+  class DevServerRunner < Webpacker::Runner
+    def run
+      load_config
+      detect_port!
+      execute_cmd
+    end
+
+    private
+      def load_config
+        app_root = Pathname.new(@app_path)
+
+        @config = Configuration.new(
+          root_path: app_root,
+          config_path: app_root.join("config/webpacker.yml"),
+          env: ENV["JETS_ENV"]
+        )
+
+        dev_server = DevServer.new(@config)
+
+        @hostname          = dev_server.host
+        @port              = dev_server.port
+        @pretty            = dev_server.pretty?
+
+      rescue Errno::ENOENT, NoMethodError
+        $stdout.puts "webpack dev_server configuration not found in #{@config.config_path}[#{ENV["JETS_ENV"]}]."
+        $stdout.puts "Please run bundle exec rails webpacker:install to install Webpacker"
+        exit!
+      end
+
+      def detect_port!
+        server = TCPServer.new(@hostname, @port)
+        server.close
+
+      rescue Errno::EADDRINUSE
+        $stdout.puts "Another program is running on port #{@port}. Set a new port in #{@config.config_path} for dev_server"
+        exit!
+      end
+
+      def execute_cmd
+        env = Webpacker::Compiler.env
+
+        cmd = if node_modules_bin_exist?
+          ["#{@node_modules_bin_path}/webpack-dev-server"]
+        else
+          ["yarn", "webpack-dev-server"]
+        end
+
+        if ARGV.include?("--debug")
+          cmd = [ "node", "--inspect-brk"] + cmd
+          ARGV.delete("--debug")
+        end
+
+        cmd += ["--config", @webpack_config]
+        cmd += ["--progress", "--color"] if @pretty
+
+        Dir.chdir(@app_path) do
+          Kernel.exec env, *cmd
+        end
+      end
+
+      def node_modules_bin_exist?
+        File.exist?("#{@node_modules_bin_path}/webpack-dev-server")
+      end
+  end
+end

data/lib/webpacker/env.rb

@@ -0,0 +1,39 @@
+class Webpacker::Env
+  DEFAULT = "production".freeze
+
+  delegate :config_path, :logger, to: :@webpacker
+
+  def self.inquire(webpacker)
+    new(webpacker).inquire
+  end
+
+  def initialize(webpacker)
+    @webpacker = webpacker
+  end
+
+  def inquire
+    fallback_env_warning if config_path.exist? && !current
+    current || DEFAULT.inquiry
+  end
+
+  private
+    def current
+      Jets.env.presence_in(available_environments)
+    end
+
+    def fallback_env_warning
+      logger.info "JETS_ENV=#{Jets.env} environment is not defined in config/webpacker.yml, falling back to #{DEFAULT} environment"
+    end
+
+    def available_environments
+      if config_path.exist?
+        YAML.load(config_path.read).keys
+      else
+        [].freeze
+      end
+    rescue Psych::SyntaxError => e
+      raise "YAML syntax error occurred while parsing #{config_path}. " \
+            "Please note that YAML must be consistently indented using spaces. Tabs are not allowed. " \
+            "Error: #{e.message}"
+    end
+end

data/lib/webpacker/helper.rb

@@ -0,0 +1,176 @@
+module Webpacker::Helper
+  # Returns the current Webpacker instance.
+  # Could be overridden to use multiple Webpacker
+  # configurations within the same app (e.g. with engines).
+  def current_webpacker_instance
+    Webpacker.instance
+  end
+
+  # Computes the relative path for a given Webpacker asset.
+  # Returns the relative path using manifest.json and passes it to asset_path helper.
+  # This will use asset_path internally, so most of their behaviors will be the same.
+  #
+  # Example:
+  #
+  #   # When extract_css is false in webpacker.yml and the file is a css:
+  #   <%= asset_pack_path 'calendar.css' %>  # => nil
+  #
+  #   # When extract_css is true in webpacker.yml or the file is not a css:
+  #   <%= asset_pack_path 'calendar.css' %> # => "/packs/calendar-1016838bab065ae1e122.css"
+  def asset_pack_path(name, **options)
+    if current_webpacker_instance.config.extract_css? || !stylesheet?(name)
+      asset_path(current_webpacker_instance.manifest.lookup!(name), options)
+    end
+  end
+
+  # Computes the absolute path for a given Webpacker asset.
+  # Returns the absolute path using manifest.json and passes it to asset_url helper.
+  # This will use asset_url internally, so most of their behaviors will be the same.
+  #
+  # Example:
+  #
+  #   # When extract_css is false in webpacker.yml and the file is a css:
+  #   <%= asset_pack_url 'calendar.css' %> # => nil
+  #
+  #   # When extract_css is true in webpacker.yml or the file is not a css:
+  #   <%= asset_pack_url 'calendar.css' %> # => "http://example.com/packs/calendar-1016838bab065ae1e122.css"
+  def asset_pack_url(name, **options)
+    if current_webpacker_instance.config.extract_css? || !stylesheet?(name)
+      asset_url(current_webpacker_instance.manifest.lookup!(name), options)
+    end
+  end
+
+  # Creates an image tag that references the named pack file.
+  #
+  # Example:
+  #
+  #  <%= image_pack_tag 'application.png', size: '16x10', alt: 'Edit Entry' %>
+  #  <img alt='Edit Entry' src='/packs/application-k344a6d59eef8632c9d1.png' width='16' height='10' />
+  def image_pack_tag(name, **options)
+    image_tag(resolve_path_to_image(name), options)
+  end
+
+  # Creates a link tag for a favicon that references the named pack file.
+  #
+  # Example:
+  #
+  #  <%= favicon_pack_tag 'mb-icon.png', rel: 'apple-touch-icon', type: 'image/png' %>
+  #  <link href="/packs/mb-icon-k344a6d59eef8632c9d1.png" rel="apple-touch-icon" type="image/png" />
+  def favicon_pack_tag(name, **options)
+    favicon_link_tag(resolve_path_to_image(name), options)
+  end
+
+  # Creates a script tag that references the named pack file, as compiled by webpack per the entries list
+  # in config/webpack/shared.js. By default, this list is auto-generated to match everything in
+  # app/javascript/packs/*.js. In production mode, the digested reference is automatically looked up.
+  #
+  # Example:
+  #
+  #   <%= javascript_pack_tag 'calendar', 'data-turbolinks-track': 'reload' %> # =>
+  #   <script src="/packs/calendar-1016838bab065ae1e314.js" data-turbolinks-track="reload"></script>
+  def javascript_pack_tag(*names, **options)
+    javascript_include_tag(*sources_from_manifest_entries(names, type: :javascript), **options)
+  end
+
+  # Creates script tags that reference the js chunks from entrypoints when using split chunks API,
+  # as compiled by webpack per the entries list in config/webpack/shared.js.
+  # By default, this list is auto-generated to match everything in
+  # app/javascript/packs/*.js and all the dependent chunks. In production mode, the digested reference is automatically looked up.
+  # See: https://webpack.js.org/plugins/split-chunks-plugin/
+  # Example:
+  #
+  #   <%= javascript_packs_with_chunks_tag 'calendar', 'map', 'data-turbolinks-track': 'reload' %> # =>
+  #   <script src="/packs/vendor-16838bab065ae1e314.chunk.js" data-turbolinks-track="reload"></script>
+  #   <script src="/packs/calendar~runtime-16838bab065ae1e314.chunk.js" data-turbolinks-track="reload"></script>
+  #   <script src="/packs/calendar-1016838bab065ae1e314.chunk.js" data-turbolinks-track="reload"></script>
+  #   <script src="/packs/map~runtime-16838bab065ae1e314.chunk.js" data-turbolinks-track="reload"></script>
+  #   <script src="/packs/map-16838bab065ae1e314.chunk.js" data-turbolinks-track="reload"></script>
+  # DO:
+  # <%= javascript_packs_with_chunks_tag 'calendar', 'map' %>
+  # DON'T:
+  # <%= javascript_packs_with_chunks_tag 'calendar' %>
+  # <%= javascript_packs_with_chunks_tag 'map' %>
+  def javascript_packs_with_chunks_tag(*names, **options)
+    javascript_include_tag(*sources_from_manifest_entrypoints(names, type: :javascript), **options)
+  end
+
+  # Creates a link tag, for preloading, that references a given Webpacker asset.
+  # In production mode, the digested reference is automatically looked up.
+  # See: https://developer.mozilla.org/en-US/docs/Web/HTML/Preloading_content
+  # Example:
+  #
+  #   <%= preload_pack_asset 'fonts/fa-regular-400.woff2' %> # =>
+  #   <link rel="preload" href="/packs/fonts/fa-regular-400-944fb546bd7018b07190a32244f67dc9.woff2" as="font" type="font/woff2" crossorigin="anonymous">
+  def preload_pack_asset(name, **options)
+    if self.class.method_defined?(:preload_link_tag)
+      preload_link_tag(current_webpacker_instance.manifest.lookup!(name), options)
+    else
+      raise "You need Rails >= 5.2 to use this tag."
+    end
+  end
+
+  # Creates a link tag that references the named pack file, as compiled by webpack per the entries list
+  # in config/webpack/shared.js. By default, this list is auto-generated to match everything in
+  # app/javascript/packs/*.js. In production mode, the digested reference is automatically looked up.
+  #
+  # Note: If the development server is running and hot module replacement is active, this will return nothing.
+  # In that setup you need to configure your styles to be inlined in your JavaScript for hot reloading.
+  #
+  # Examples:
+  #
+  #   # When extract_css is false in webpacker.yml:
+  #   <%= stylesheet_pack_tag 'calendar', 'data-turbolinks-track': 'reload' %> # =>
+  #   nil
+  #
+  #   # When extract_css is true in webpacker.yml:
+  #   <%= stylesheet_pack_tag 'calendar', 'data-turbolinks-track': 'reload' %> # =>
+  #   <link rel="stylesheet" media="screen" href="/packs/calendar-1016838bab065ae1e122.css" data-turbolinks-track="reload" />
+  def stylesheet_pack_tag(*names, **options)
+    if current_webpacker_instance.config.extract_css?
+      stylesheet_link_tag(*sources_from_manifest_entries(names, type: :stylesheet), **options)
+    end
+  end
+
+  # Creates link tags that reference the css chunks from entrypoints when using split chunks API,
+  # as compiled by webpack per the entries list in config/webpack/shared.js.
+  # By default, this list is auto-generated to match everything in
+  # app/javascript/packs/*.js and all the dependent chunks. In production mode, the digested reference is automatically looked up.
+  # See: https://webpack.js.org/plugins/split-chunks-plugin/
+  #
+  # Examples:
+  #
+  #   <%= stylesheet_packs_with_chunks_tag 'calendar', 'map' %> # =>
+  #   <link rel="stylesheet" media="screen" href="/packs/3-8c7ce31a.chunk.css" />
+  #   <link rel="stylesheet" media="screen" href="/packs/calendar-8c7ce31a.chunk.css" />
+  #   <link rel="stylesheet" media="screen" href="/packs/map-8c7ce31a.chunk.css" />
+  # DO:
+  # <%= stylesheet_packs_with_chunks_tag 'calendar', 'map' %>
+  # DON'T:
+  # <%= stylesheet_packs_with_chunks_tag 'calendar' %>
+  # <%= stylesheet_packs_with_chunks_tag 'map' %>
+  def stylesheet_packs_with_chunks_tag(*names, **options)
+    if current_webpacker_instance.config.extract_css?
+      stylesheet_link_tag(*sources_from_manifest_entrypoints(names, type: :stylesheet), **options)
+    end
+  end
+
+  private
+    def stylesheet?(name)
+      File.extname(name) == ".css"
+    end
+
+    def sources_from_manifest_entries(names, type:)
+      names.map { |name| current_webpacker_instance.manifest.lookup!(name, type: type) }.flatten
+    end
+
+    def sources_from_manifest_entrypoints(names, type:)
+      names.map { |name| current_webpacker_instance.manifest.lookup_pack_with_chunks!(name, type: type) }.flatten.uniq
+    end
+
+    def resolve_path_to_image(name)
+      path = name.starts_with?("media/images/") ? name : "media/images/#{name}"
+      asset_path(current_webpacker_instance.manifest.lookup!(path))
+    rescue
+      asset_path(current_webpacker_instance.manifest.lookup!(name))
+    end
+end

data/lib/webpacker/instance.rb

@@ -0,0 +1,37 @@
+class Webpacker::Instance
+  cattr_accessor(:logger) { ActiveSupport::TaggedLogging.new(ActiveSupport::Logger.new(STDOUT)) }
+
+  attr_reader :root_path, :config_path
+
+  def initialize(root_path: Jets.root, config_path: Jets.root.join("config/webpacker.yml"))
+    @root_path, @config_path = root_path, config_path
+  end
+
+  def env
+    @env ||= Webpacker::Env.inquire self
+  end
+
+  def config
+    @config ||= Webpacker::Configuration.new(
+      root_path: root_path,
+      config_path: config_path,
+      env: env
+    )
+  end
+
+  def compiler
+    @compiler ||= Webpacker::Compiler.new self
+  end
+
+  def dev_server
+    @dev_server ||= Webpacker::DevServer.new config
+  end
+
+  def manifest
+    @manifest ||= Webpacker::Manifest.new self
+  end
+
+  def commands
+    @commands ||= Webpacker::Commands.new self
+  end
+end

data/lib/webpacker/manifest.rb

@@ -0,0 +1,118 @@
+# Singleton registry for accessing the packs path using a generated manifest.
+# This allows javascript_pack_tag, stylesheet_pack_tag, asset_pack_path to take a reference to,
+# say, "calendar.js" or "calendar.css" and turn it into "/packs/calendar-1016838bab065ae1e314.js" or
+# "/packs/calendar-1016838bab065ae1e314.css".
+#
+# When the configuration is set to on-demand compilation, with the `compile: true` option in
+# the webpacker.yml file, any lookups will be preceded by a compilation if one is needed.
+class Webpacker::Manifest
+  class MissingEntryError < StandardError; end
+
+  delegate :config, :compiler, :dev_server, to: :@webpacker
+
+  def initialize(webpacker)
+    @webpacker = webpacker
+  end
+
+  def refresh
+    @data = load
+  end
+
+  def lookup_pack_with_chunks(name, pack_type = {})
+    compile if compiling?
+
+    manifest_pack_type = manifest_type(pack_type[:type])
+    manifest_pack_name = manifest_name(name, manifest_pack_type)
+    find("entrypoints")[manifest_pack_name][manifest_pack_type]
+  rescue NoMethodError
+    nil
+  end
+
+  def lookup_pack_with_chunks!(name, pack_type = {})
+    lookup_pack_with_chunks(name, pack_type) || handle_missing_entry(name)
+  end
+
+  # Computes the relative path for a given Webpacker asset using manifest.json.
+  # If no asset is found, returns nil.
+  #
+  # Example:
+  #
+  #   Webpacker.manifest.lookup('calendar.js') # => "/packs/calendar-1016838bab065ae1e122.js"
+  def lookup(name, pack_type = {})
+    compile if compiling?
+
+    find(full_pack_name(name, pack_type[:type]))
+  end
+
+  # Like lookup, except that if no asset is found, raises a Webpacker::Manifest::MissingEntryError.
+  def lookup!(name, pack_type = {})
+    lookup(name, pack_type) || handle_missing_entry(name)
+  end
+
+  private
+    def compiling?
+      config.compile? && !dev_server.running?
+    end
+
+    def compile
+      Webpacker.logger.tagged("Webpacker") { compiler.compile }
+    end
+
+    def data
+      if config.cache_manifest?
+        @data ||= load
+      else
+        refresh
+      end
+    end
+
+    def find(name)
+      data[name.to_s].presence
+    end
+
+    def full_pack_name(name, pack_type)
+      return name unless File.extname(name.to_s).empty?
+      "#{name}.#{manifest_type(pack_type)}"
+    end
+
+    def handle_missing_entry(name)
+      raise Webpacker::Manifest::MissingEntryError, missing_file_from_manifest_error(name)
+    end
+
+    def load
+      if config.public_manifest_path.exist?
+        JSON.parse config.public_manifest_path.read
+      else
+        {}
+      end
+    end
+
+    # The `manifest_name` method strips of the file extension of the name, because in the
+    # manifest hash the entrypoints are defined by their pack name without the extension.
+    # When the user provides a name with a file extension, we want to try to strip it off.
+    def manifest_name(name, pack_type)
+      return name if File.extname(name.to_s).empty?
+      File.basename(name, pack_type)
+    end
+
+    def manifest_type(pack_type)
+      case pack_type
+      when :javascript then "js"
+      when :stylesheet then "css"
+      else pack_type.to_s
+      end
+    end
+
+    def missing_file_from_manifest_error(bundle_name)
+      <<-MSG
+Webpacker can't find #{bundle_name} in #{config.public_manifest_path}. Possible causes:
+1. You want to set webpacker.yml value of compile to true for your environment
+   unless you are using the `webpack -w` or the webpack-dev-server.
+2. webpack has not yet re-run to reflect updates.
+3. You have misconfigured Webpacker's config/webpacker.yml file.
+4. Your webpack configuration is not creating a manifest.
+Your manifest contains:
+#{JSON.pretty_generate(@data)}
+      MSG
+    end
+end