sewing_kit 0.4.6

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: 431a33c19363e493c74124b1f416b5d471b36e0a
+  data.tar.gz: 61cf9620bea767548234570e668e06e5959bddcc
+SHA512:
+  metadata.gz: 0ef8fb8b4705914731c8bf9bd1a5f923ccac21f77b51f334dbde35d53ec79f19c7b7070fb788144e17222869d044775816bbc1ca0a99748072d495ec7c2d4613
+  data.tar.gz: ca77a8b18313019c03ed0524688663c13016d3994573288d20a837410fbd35baf1ebdc14c1cf56285cd486418c1c69e90394169b3ac6268310ebdbf301954a1e

data/README.md

@@ -0,0 +1,9 @@
+# sewing_kit
+
+A solid foundation for modern FED stacks in Shopify apps.
+
+## Other repos
+
+https://github.com/rails/webpacker
+https://github.com/shakacode/react_on_rails
+https://github.com/mipearson/webpack-rails

data/lib/install/app/basic/components/App/App.js

@@ -0,0 +1,8 @@
+import * as styles from './App.scss';
+
+export default function App() {
+  const node = document.createElement('div');
+  node.textContent = 'Hello world!';
+  node.className = styles.App;
+  return node;
+}

data/lib/install/app/basic/components/App/App.scss

@@ -0,0 +1,4 @@
+.App {
+  font-size: 4rem;
+  font-weight: bold;
+}

data/lib/install/app/basic/components/App/index.js

@@ -0,0 +1,3 @@
+import App from './App';
+
+export default App;

data/lib/install/app/basic/index.js

@@ -0,0 +1,5 @@
+import App from './components/App';
+
+document.body.appendChild(
+  App()
+);

data/lib/install/app/quilt/components/App/App.js

@@ -0,0 +1,10 @@
+import * as React from 'react';
+import {Content, Header} from '@shopify/quilt';
+
+export default function App() {
+  return (
+    <Content header={<Header>TODO</Header>}>
+      <div className={styles.App}>Hello world!</div>
+    </Content>
+  );
+}

data/lib/install/app/quilt/components/App/App.scss

@@ -0,0 +1,4 @@
+.App {
+  font-size: 4rem;
+  font-weight: bold;
+}

data/lib/install/app/quilt/components/App/index.js

@@ -0,0 +1,3 @@
+import App from './App';
+
+export default App;

data/lib/install/app/quilt/index.js

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import {render} from 'react-dom';
+import App from './components/App';
+
+const node = document.getElementById('app');
+render(<App />, node);

data/lib/install/bin/webpack.tt

@@ -0,0 +1,12 @@
+<%= shebang %>
+
+NODE_ENV = ENV["NODE_ENV"] || ENV["RAILS_ENV"] || "development"
+APP_PATH = File.expand_path('../', __dir__)
+VENDOR_PATH = File.expand_path('../vendor', __dir__)
+
+WEBPACK_BIN = "./node_modules/.bin/webpack"
+WEBPACK_CONFIG = "#{APP_PATH}/config/sewing-kit.config.js"
+
+Dir.chdir(APP_PATH) do
+  exec "NODE_ENV=#{NODE_ENV} #{WEBPACK_BIN} --config #{WEBPACK_CONFIG} #{ARGV.join(" ")}"
+end

data/lib/install/patchwork/install_generator.rb

@@ -0,0 +1,73 @@
+module Patchwork
+  class InstallGenerator < ::Rails::Generators::Base
+    attr_accessor :wants_react
+    attr_accessor :wants_typescript
+
+    source_root File.expand_path("./templates", __FILE__)
+
+    desc "Install everything you need for a basic Patchwork integration"
+
+    def add_webpack_rails_to_gemfile
+      gem 'webpack-rails'
+    end
+
+    # def ask_about_react
+    #   wants_react = yes?("Would you like to use React for this project?")
+    #   wants_typescript = yes?("Would you like to use TypeScript for this project?")
+    # end
+
+    def augment_package_json
+      # TODO: linting, tests, build
+    end
+
+    # def copy_webpack_config
+    #   copy_file "sewing-kit.config.js", "config/sewing-kit.config.js"
+    # end
+
+    # def copy_typescript_config
+    #   return unless wants_typescript
+    #   copy_file "tsconfig.json", "tsconfig.json"
+    # end
+
+    def create_entry_point
+      empty_directory "app/ui"
+
+      elsif wants_react
+        directory "app/quilt", "app/ui"
+      else
+        directory "app/basic", "app/ui"
+      end
+    end
+
+    # def add_to_gitignore
+    #   append_to_file ".gitignore" do
+    #     <<-EOF.strip_heredoc
+    #     # Added by patchwork
+    #     /node_modules
+    #     /public/webpack
+    #     EOF
+    #   end
+    # end
+
+    # def install_javascript_dependencies
+    #   dependencies = ["webpack", "@shopify/patchwork"]
+    #   dependencies.concat(["react", "react-dom", "@shopify/quilt"]) if wants_react
+
+    #   run "yarn add --dev #{dependencies.join(" ")}"
+    # end
+
+    # def run_bundle_install
+    #   run "bundle install" if yes?("Would you like us to run 'bundle install' for you?")
+    # end
+
+  #   def whats_next
+  #     puts <<-EOF.strip_heredoc
+  #       We've set up the basics of a modern FED stack for you, but you'll still
+  #       need to:
+  #         1. Add the 'main' entry point in to your layout, and
+  #         2. Run 'foreman start' to run the webpack-dev-server and rails server
+  #       Thanks for using Patchwork!
+  #     EOF
+  #   end
+  # end
+end

data/lib/install/sewing-kit.config.js

@@ -0,0 +1,5 @@
+module.exports = function() {
+  assetDevServerHost: 'localhost',
+  assetDevServerPort: 9876,
+  assetDevServerPath: 'assets/',
+}

data/lib/install/template.rb

@@ -0,0 +1,101 @@
+TEMPLATE_PATH = File.dirname(__FILE__)
+
+# Questions
+
+wants_react = true#yes?("Would you like to use React for this project?")
+wants_typescript = true#yes?("Would you like to use TypeScript for this project?")
+
+# Entry point
+
+if wants_react
+  directory "#{TEMPLATE_PATH}/app/quilt", "app/ui"
+else
+  directory "#{TEMPLATE_PATH}/app/basic", "app/ui"
+end
+
+# Binaries
+
+directory "#{TEMPLATE_PATH}/bin", "bin"
+chmod "bin", 0755 & ~File.umask, verbose: false
+
+# Other
+
+append_to_file ".gitignore", <<-EOS.strip_heredoc
+
+  # Added by sewing_kit
+  /node_modules
+  /public/patckwork
+EOS
+
+# Configuration
+
+## package.json
+
+package_json_path = File.expand_path "./package.json", destination_root
+package_json = File.exists?(package_json_path) ? JSON.parse(File.read(package_json_path)) : Hash.new
+scripts = package_json.fetch("scripts", Hash.new)
+
+unless scripts.key?("lint")
+  scripts["lint"] = wants_typescript ? "tslint ./app" : "eslint ./app --max-warnings 0"
+end
+
+unless scripts.key?("test")
+  scripts["test"] = ""
+end
+
+unless scripts.key?("check")
+  scripts["check"] = "yarn run lint && yarn run test"
+end
+
+unless wants_typescript
+  scripts["eslintConfig"] = {
+    "extends": [
+      wants_react ? "plugin:shopify/react" : "plugin:shopify/esnext"
+    ]
+  }
+end
+
+package_json["scripts"] = scripts
+create_file package_json_path, JSON.pretty_generate(package_json, indent: "  ")
+
+## other
+
+copy_file "#{TEMPLATE_PATH}/sewing-kit.config.js", "config/sewing-kit.config.js"
+
+if wants_typescript
+  copy_file "#{TEMPLATE_PATH}/tsconfig.json", "tsconfig.json"
+  copy_file "#{TEMPLATE_PATH}/tslint.json", "tslint.json"
+  empty_directory "config/typescript/modules"
+else
+  copy_file "#{TEMPLATE_PATH}/.eslintignore", ".eslintignore"
+end
+
+# Dependencies
+
+dev_dependencies = %w(webpack@2.2.0 file:../../sewing-kit)
+
+if wants_typescript
+  # dev_dependencies.concat(["typescript", "tslint", "tslint-config-shopify"])
+  dev_dependencies.concat %w(typescript tslint)
+else
+  dev_dependencies.concat %w(eslint eslint-plugin-shopify)
+end
+
+run "yarn add --dev #{dev_dependencies.join(" ")}"
+
+dependencies = []
+dependencies.concat %w(react react-dom file:../../quilt) if wants_react
+
+run "yarn add #{dependencies.join(" ")}"
+
+# Finishing up
+
+puts <<-EOS.strip_heredoc
+  We've set up the basics of a modern FED stack for you, but you'll still
+  need to:
+
+    1. Add the 'main' entry point in to your layout, and
+    2. Run 'foreman start' to run the webpack-dev-server and rails server
+
+  Thanks for using Sewing Kit!
+EOS

data/lib/install/tsconfig.json

@@ -0,0 +1,35 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "rootDir": ".",
+    "target": "es6",
+    "module": "es2015",
+    "moduleResolution": "node",
+    "jsx": "react",
+    "strictNullChecks": true,
+    "noImplicitAny": true,
+    "experimentalDecorators": true,
+    "typeRoots": [
+      "./node_modules/@types"
+    ],
+    "paths": {
+      "*": [
+        "*",
+        "app/ui/*"
+      ]
+    },
+    "lib": [
+     "dom",
+     "es2015",
+     "es2016",
+     "es2017",
+     "dom.iterable",
+     "scripthost"
+    ]
+  },
+  "include": [
+    "node_modules/@shopify/patchwork/typescript",
+    "config/typescript/**/*",
+    "app/**/*"
+  ]
+}

data/lib/install/tslint.json

@@ -0,0 +1,3 @@
+{
+  "extends": ["tslint-config-shopify"]
+}

data/lib/sewing_kit.rb

@@ -0,0 +1,5 @@
+module SewingKit
+end
+
+require "sewing_kit/version"
+require "sewing_kit/rails"

data/lib/sewing_kit/rails.rb

@@ -0,0 +1 @@
+require "sewing_kit/railtie" if defined? Rails

data/lib/sewing_kit/railtie.rb

@@ -0,0 +1,32 @@
+require 'rails'
+require 'rails/railtie'
+require 'sewing_kit/webpack/compiler'
+require 'sewing_kit/webpack/helper'
+require 'sewing_kit/webpack/dev'
+
+module SewingKit
+  class Railtie < ::Rails::Railtie
+    initializer "sewing_kit.initialize_webpack" do
+      if Rails.env.development? && Rails.const_defined?(:Server)
+        webpack_dev = SewingKit::Webpack::Dev.new
+        webpack_dev.start
+      end
+    end
+
+    config.after_initialize do
+      ActiveSupport.on_load(:action_view) do
+        include SewingKit::Webpack::Helper
+      end
+    end
+
+    config.sewing_kit = ActiveSupport::OrderedOptions.new
+    config.sewing_kit.webpack = ActiveSupport::OrderedOptions.new
+    config.sewing_kit.webpack.manifest_dir = 'tmp/sewing-kit'
+    config.sewing_kit.webpack.manifest_filename = 'sewing-kit-manifest.json'
+    config.sewing_kit.webpack.verbose = false
+
+    rake_tasks do
+      load "tasks/sewing_kit.rake"
+    end
+  end
+end

data/lib/sewing_kit/version.rb

@@ -0,0 +1,3 @@
+module SewingKit
+  VERSION = "0.4.6"
+end

data/lib/sewing_kit/webpack/compiler.rb

@@ -0,0 +1,41 @@
+module SewingKit
+  module Webpack
+    class Compiler
+      def compile
+        result = Kernel.system(
+          { 'NODE_ENV' => node_env },
+          *command,
+          chdir: Rails.root.to_s,
+          out: $stdout,
+          err: $stderr,
+        )
+
+        if !result
+          puts "sewing-kit compile failed with error code #{$?}"
+          exit(1)
+        end
+        result
+      end
+
+      private
+
+      def command
+        [
+          'node_modules/.bin/sewing-kit',
+          'compile',
+          '--config-file',
+          'config/sewing-kit.config.js',
+          '--target',
+          'client',
+          '--env',
+          node_env,
+        ].reject(&:empty?)
+      end
+
+      private
+      def node_env
+        ENV['NODE_ENV'] || Rails.env.to_s
+      end
+    end
+  end
+end

data/lib/sewing_kit/webpack/dev.rb

@@ -0,0 +1,72 @@
+module SewingKit
+  module Webpack
+    class Dev
+      attr_accessor :pid
+
+      def start
+        @pid = spawn
+        detach
+      end
+
+      private
+
+      def command
+        cmd = [
+          'node_modules/.bin/sewing-kit',
+          'dev',
+          '--config-file',
+          'config/sewing-kit.config.js',
+          '--target',
+          'client',
+          '--env',
+          node_env
+        ]
+
+        if hmr?
+          cmd += ['--hot', '--hot-host', hot_host]
+        else
+          cmd += ['--lazy', '--super-speed']
+        end
+
+        cmd += ['--verbose'] if ::Rails.configuration.sewing_kit.webpack.verbose
+
+        cmd
+      end
+
+      def spawn
+        Kernel.spawn(
+          { 'NODE_ENV' => node_env },
+          *command,
+          chdir: Rails.root.to_s,
+          out: $stdout,
+          err: $stderr,
+        ) || exit(1)
+      end
+
+      def detach
+        Process.detach pid
+      end
+
+      def hmr?
+        @hmr ||= ENV['SK_DISABLE_HMR'] != 'true'
+      end
+
+      def hot_host
+        if host = ::Rails.configuration.sewing_kit.webpack.asset_host
+          if host.is_a?(Proc) || host.respond_to?(:call)
+            host.call(nil, nil)
+          else
+            host
+          end
+        else
+          "/"
+        end
+      end
+
+      private
+      def node_env
+        ENV['NODE_ENV'] || Rails.env.to_s
+      end
+    end
+  end
+end

data/lib/sewing_kit/webpack/helper.rb

@@ -0,0 +1,76 @@
+require 'base64'
+require 'action_view/helpers'
+require 'sewing_kit/webpack/manifest'
+
+module SewingKit
+  module Webpack
+    module Helper
+      include ActionView::Helpers
+
+      def webpack_asset_paths(source, extension: 'js')
+        return '' unless source.present?
+
+        paths = SewingKit::Webpack::Manifest.asset_paths(source)
+
+        return '' unless paths[extension]
+
+        [paths[extension]].flatten.reject { |path| path =~ /.*\.map$/ }
+      end
+
+      def sewing_kit_link_tag(*paths)
+        return  '' if Rails.env.development?
+
+        options = paths.extract_options!
+
+        tags = paths.uniq.map { |path|
+          create_asset_tag(:link, path, options)
+        }
+
+        safe_join(tags, "\n")
+      end
+
+      def sewing_kit_script_tag(*paths)
+        options = paths.extract_options!
+
+        tags = paths.uniq.map { |path|
+          create_asset_tag(:script, path, options)
+        }
+
+        safe_join(tags, "\n")
+      end
+
+      private
+
+      def create_asset_tag(tag_type, path, tag_options)
+        raise ArgumentError, "Invalid tag type: #{tag_type}" unless [:script, :link].include? tag_type
+
+        options = tag_options.clone
+
+        if tag_options[:integrity]
+          file_hash = extract_hash(path)
+          options[:integrity] = file_hash ? encode_hash(file_hash) : nil
+        end
+
+        case tag_type
+        when :script
+          content_tag(:script, '', options.reverse_merge(src: path))
+        when :link
+          tag(:link, options.reverse_merge(href: path, rel: 'stylesheet'))
+        end
+      end
+
+      def encode_hash(hash)
+        # sewing-kit's default config places a sha256 hash in the filename. Browsers expect integrity
+        # to be the Base64 encoded version of the binary hash prefixed with the hashing algorithm
+        binary_hash = Array(hash).pack('H*')
+        "sha256-#{Base64.strict_encode64(binary_hash)}"
+      end
+
+      def extract_hash(path)
+        # Consumes sewing-kit's [name]-[chunkhash].[ext] format
+        return unless path =~ /.*-[A-Za-z0-9]{64}\.(js|css)/
+        path.rpartition('-').last.split('.').first
+      end
+    end
+  end
+end

data/lib/sewing_kit/webpack/manifest.rb

@@ -0,0 +1,65 @@
+require 'uri'
+
+module SewingKit
+  module Webpack
+    # Webpack manifest loading, caching & entry point retrieval
+    class Manifest
+      # Raised if we can't read our webpack manifest for whatever reason
+      class ManifestLoadError < StandardError
+        def initialize(message, orig)
+          super "#{message} (original error #{orig})"
+        end
+      end
+
+      # Raised if a supplied entry point does not exist in the webpack manifest
+      class EntryPointMissingError < StandardError
+      end
+
+      class << self
+        # :nodoc:
+        def asset_paths(source)
+          paths = manifest[source]
+          if paths
+            paths
+          else
+            raise EntryPointMissingError, "Can't find entry point '#{source}' in webpack manifest"
+          end
+        end
+
+        def manifest
+          if ::Rails.env.production?
+            # Cache at class level, as JSON loading/parsing can be expensive.
+            @manifest ||= load_manifest
+          else
+            # Cache if we're outside of production; manifest may change.
+            load_manifest
+          end
+        end
+
+        private
+
+        def manifest_bundled?
+          !manifest["errors"].any? { |error| error.include? "Module build failed" }
+        end
+
+        def load_manifest
+          data = load_static_manifest
+          JSON.parse(data)
+        end
+
+        def load_static_manifest
+          File.read(static_manifest_path)
+        rescue => e
+          raise ManifestLoadError.new("Could not load compiled manifest from #{static_manifest_path} - have you run `rake sewing_kit:compile`?", e)
+        end
+
+        def static_manifest_path
+          ::Rails.root.join(
+            ::Rails.configuration.sewing_kit.webpack.manifest_dir,
+            ::Rails.configuration.sewing_kit.webpack.manifest_filename
+          )
+        end
+      end
+    end
+  end
+end

data/lib/tasks/sewing_kit.rake

@@ -0,0 +1,20 @@
+TEMPLATE_PATH = File.expand_path("../install/template.rb", File.dirname(__FILE__))
+
+namespace :sewing_kit do
+  desc "Install all of Shopify’s modern FED tooling"
+  task :install do
+    exec "./bin/rails app:template LOCATION=#{TEMPLATE_PATH}"
+  end
+
+  desc "Build webpack asset bundles"
+  task :compile => :environment do
+    compiler = SewingKit::Webpack::Compiler.new
+    compiler.compile
+  end
+end
+
+if Rake::Task.task_defined?('assets:precompile')
+  Rake::Task['assets:precompile'].enhance do
+    Rake::Task['sewing_kit:compile'].invoke
+  end
+end

metadata

@@ -0,0 +1,98 @@
+--- !ruby/object:Gem::Specification
+name: sewing_kit
+version: !ruby/object:Gem::Version
+  version: 0.4.6
+platform: ruby
+authors:
+- Chris Sauve
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2017-07-17 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: railties
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 3.2.0
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 3.2.0
+- !ruby/object:Gem::Dependency
+  name: rails
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 3.2.0
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 3.2.0
+description: 
+email:
+- chris.sauve@shopify.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- README.md
+- lib/install/app/basic/components/App/App.js
+- lib/install/app/basic/components/App/App.scss
+- lib/install/app/basic/components/App/index.js
+- lib/install/app/basic/index.js
+- lib/install/app/quilt/components/App/App.js
+- lib/install/app/quilt/components/App/App.scss
+- lib/install/app/quilt/components/App/index.js
+- lib/install/app/quilt/index.js
+- lib/install/bin/webpack.tt
+- lib/install/patchwork/component_generator.rb
+- lib/install/patchwork/install_generator.rb
+- lib/install/patchwork/section_generator.rb
+- lib/install/sewing-kit.config.js
+- lib/install/template.rb
+- lib/install/tsconfig.json
+- lib/install/tslint.json
+- lib/sewing_kit.rb
+- lib/sewing_kit/rails.rb
+- lib/sewing_kit/railtie.rb
+- lib/sewing_kit/version.rb
+- lib/sewing_kit/webpack/compiler.rb
+- lib/sewing_kit/webpack/dev.rb
+- lib/sewing_kit/webpack/helper.rb
+- lib/sewing_kit/webpack/manifest.rb
+- lib/tasks/sewing_kit.rake
+homepage: 
+licenses:
+- MIT
+metadata: {}
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: 2.0.0
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project: 
+rubygems_version: 2.5.2
+signing_key: 
+specification_version: 4
+summary: Shopify’s modern front-end tooling, nicely packaged for Rails
+test_files: []