middleman-webpacked 0.0.2 → 0.0.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 9c6871016b63c750529f7050aef41c01652fe011
-  data.tar.gz: 95b3c3e2b0ec9a83d78cdf435a356c26c9b792a8
+  metadata.gz: ba1745c3e19d9181e2bbd1f5e0323ab053e8d0d4
+  data.tar.gz: dd27734e99905e4c9894f639672b632a2f63c40a
 SHA512:
-  metadata.gz: 4010c42165f9a037890d7d4b9b44bf29979d9b4a46a10d86c1a6bb0c9e9afabc329bb3f9af837b3567dd8f7c23d9196d9fa70e7001eead92e814313759210dbf
-  data.tar.gz: 0fc5b4352f633a13e53c47625509c15b1c62c06e3529865e41621b0ea14421c7b0763322cc8720c83f09d37303475cb92d0c8c13981332f85402c4b6f47987e8
+  metadata.gz: d2c09955983209d77dd0612b2fe8b085ec64a7ac4115c8441859024834aa99f6a7740d036b9a688cf6a5df16785e185c2eda8ee89b34630047803218d2b36a05
+  data.tar.gz: 62ae18beb74e1ab8b81d98726ea8aeba59e63aeeea7a981c1e3b58af902e807533a3c36ced070258fd2fc511cbcb69c96cf13b669735b063ba60f27696c62406

data/README.md

@@ -1,4 +1,4 @@
-Middleman Webpack
+Middleman Webpacked
 ===
 
 ## Usage
@@ -15,6 +15,8 @@ Setup your Webpack
 middleman webpack
 ```
 
+> To enable React.js, add `--react` options when setup Webpack
+
 Add `javascript_pack_tag` to your layout
 
 ```erb
@@ -50,5 +52,6 @@ activate :webpack,
 * [x] Running Webpack without config
 * [ ] Automatic setup `webpack.config.js`
 * [x] Babel Support
-* [ ] React.js Support
+* [x] React.js Support
 * [ ] Vue.js Support
+* [ ] Sass Support

data/features/support/env.rb

@@ -1,4 +1,4 @@
 PROJECT_ROOT_PATH = File.dirname(File.dirname(File.dirname(__FILE__)))
 require 'middleman-core'
 require 'middleman-core/step_definitions'
-require File.join(PROJECT_ROOT_PATH, 'lib', 'middleman-webpack')
+require File.join(PROJECT_ROOT_PATH, 'lib', 'middleman-webpacked')

data/lib/middleman-webpacked/build.rb

@@ -0,0 +1,15 @@
+module MiddlemanWebpacked
+  class Build < CommandRunner
+    bin 'node_modules/.bin/webpack'
+    mode :production
+
+    def setup
+      @arguments.push(
+        '--bail',
+        '-p',
+        "--output-path #{options.source}/#{app.config[:js_dir]}",
+        "--config config/webpack/production.js"
+      )
+    end
+  end
+end

data/lib/middleman-webpacked/command_runner.rb

@@ -0,0 +1,58 @@
+module MiddlemanWebpacked
+  class CommandRunner
+    class << self
+      AVAILABLE_MODE = %i[production development none]
+
+      def bin(path = nil)
+        return @bin if path.nil?
+        @bin = path
+      end
+
+      def mode(new_mode = nil)
+        return @mode if new_mode.nil?
+        @mode = new_mode if AVAILABLE_MODE.include?(new_mode)
+      end
+
+      def satisfy?
+        return false if bin.nil?
+        File.exist?(bin)
+      end
+    end
+
+    attr_reader :app, :options, :mode
+
+    def initialize(app, options)
+      @app = app
+      @options = options
+      @arguments = []
+
+      setup
+    end
+
+    def setup
+      raise NotImplementedError, "The command didn't setup for execute"
+    end
+
+    def loaders
+      @loaders.map do |type, loader|
+        "--module-bind #{type}=#{loader}-loader"
+      end
+    end
+
+    def entries
+      options.entry.map do |name, path|
+        "--entry #{name}=./src/#{path}"
+      end
+    end
+
+    def command
+      [
+        self.class.bin,
+        "--mode #{self.class.mode}"
+      ]
+        .concat(entries)
+        .concat(@arguments)
+        .join(' ')
+    end
+  end
+end

data/lib/middleman-webpacked/commands/webpack.rb

@@ -5,14 +5,83 @@ module Middleman
     class Webpack < ::Thor::Group
       include Thor::Actions
 
+      BABEL_TEMPLATE = File.expand_path('../../template/babelrc.tt', __FILE__)
+      SHARED_WEBPACK_TEMPLATE = File.expand_path('../../template/shared.webpack.tt', __FILE__)
+      DEVELOPMENT_WEBPACK_TEMPLATE = File.expand_path('../../template/dev.webpack.tt', __FILE__)
+      PRODUCTION_WEBPACK_TEMPLATE = File.expand_path('../../template/prod.webpack.tt', __FILE__)
+
       check_unknown_options!
 
+      class_option 'react',
+        type: :boolean,
+        default: false,
+        desc: 'Add react support'
+
+      def self.source_root
+        File.expand_path('../../template', __FILE__)
+      end
+
+      def initialize(*args)
+        super
+
+        @app = ::Middleman::Application.new do
+          config[ :mode ]              = :config
+          config[ :disable_sitemap ]   = true
+          config[ :watcher_disable ]   = true
+          config[ :exit_before_ready ] = true
+        end
+
+        @packages = default_packages
+      end
+
       def webpack
-        run 'yarn add webpack webpack-dev-server webpack-cli babel-loader --dev'
+        @presets = ['env']
+        @loaders = []
+
+        enable_react if options[:react]
+
+        generate_config
+        run "yarn add #{@packages.join(' ')} --dev"
+      end
+
+      def generate_config
+        template BABEL_TEMPLATE, File.join(@app.root_path, '.babelrc')
+        template SHARED_WEBPACK_TEMPLATE, File.join(@app.root_path, 'config', 'webpack', 'shared.js')
+        template DEVELOPMENT_WEBPACK_TEMPLATE, File.join(@app.root_path, 'config', 'webpack', 'development.js')
+        template PRODUCTION_WEBPACK_TEMPLATE, File.join(@app.root_path, 'config', 'webpack', 'production.js')
+      end
+
+      def enable_react
+        @packages.push(
+          'babel-preset-react',
+          'react',
+          'react-dom',
+          'react-hot-loader'
+        )
+        @presets = ['env', 'react']
+        @loaders.push({
+          test: /\.(js|jsx)$/,
+          use: 'babel-loader'
+        })
       end
 
       # Add to CLI
       Base.register( self, 'webpack', 'webpack [options]', 'Install webpack to middleman')
+
+      protected
+
+      def default_packages
+        [
+          'webpack',
+          'webpack-cli',
+          'webpack-merge',
+          'webpack-dev-server',
+          'babel-loader',
+          'babel-core',
+          'babel-preset-env',
+          'compression-webpack-plugin'
+        ]
+      end
     end
   end
 end

data/lib/middleman-webpacked/extension.rb

@@ -1,20 +1,23 @@
 # Require core library
 require 'middleman-core'
 
+require 'middleman-webpacked/command_runner'
+require 'middleman-webpacked/server'
+require 'middleman-webpacked/build'
+
 # Extension namespace
 module Middleman
   class WebpackedExtension < ::Middleman::Extension
-    option :source, '.webpack-cache', 'The webpack dist path'
-    option :entry, {bundle: 'index.js'}, 'The entry points(s) of the compilation'
+    include MiddlemanWebpacked
 
-    WEBPACK_DEV_SERVER_BIN = 'node_modules/.bin/webpack-dev-server'
-    WEBPACK_BIN = 'node_modules/.bin/webpack'
+    option :source, '.webpack-cache', 'The webpack cache path'
+    option :entry, {bundle: 'index.js'}, 'The entry points(s) of the compilation'
 
     def initialize(app, options_hash={}, &block)
       super
 
-      fail 'Webpack Dev Server not found' unless File.exists?(WEBPACK_DEV_SERVER_BIN)
-      fail 'Webpack not found' unless File.exist?(WEBPACK_BIN)
+      fail 'Webpack Dev Server not found' unless Server.satisfy?
+      fail 'Webpack not found' unless Build.satisfy?
     end
 
     def after_configuration
@@ -30,19 +33,11 @@ module Middleman
     end
 
     def command
-      return build_command if app.build?
-      "#{WEBPACK_DEV_SERVER_BIN} --mode development " \
-      '--module-bind js=babel-loader ' \
-      '--hot --progress --color --inline --content-base source ' \
-      "#{options.entry.map { |name, path| "--entry #{name}=./src/#{path}" }.join(' ')} " \
-      "--output-public-path /#{app.config[:js_dir]} "
-    end
-
-    def build_command
-      "#{WEBPACK_BIN} --mode production " \
-      '--module-bind js=babel-loader ' \
-      "#{options.entry.map { |name, path| "--entry #{name}=./src/#{path}" }.join(' ')} " \
-      "--bail -p --output-path #{options.source}/#{app.config[:js_dir]}"
+      if app.build?
+        Build
+      else
+        Server
+      end.new(app, options).command
     end
 
     def after_build

data/lib/middleman-webpacked/server.rb

@@ -0,0 +1,18 @@
+module MiddlemanWebpacked
+  class Server < CommandRunner
+    bin 'node_modules/.bin/webpack-dev-server'
+    mode :development
+
+    def setup
+      @arguments.push(
+        '--hot',
+        '--progress',
+        '--color',
+        '--inline',
+        '--content-base source',
+        "--output-public-path http://localhost:8080/#{app.config[:js_dir]}",
+        "--config #{app.root_path}/config/webpack/development.js"
+      )
+    end
+  end
+end

data/lib/middleman-webpacked/template/babelrc.tt

@@ -0,0 +1,3 @@
+{
+  "presets": <%= @presets %>
+}

data/lib/middleman-webpacked/template/dev.webpack.tt

@@ -0,0 +1,12 @@
+const merge = require('webpack-merge')
+const sharedConfig = require('./shared.js')
+
+module.exports = merge(sharedConfig, {
+  devServer: {
+    headers: {
+      'Access-Control-Allow-Origin': '*',
+      'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, PATCH, OPTIONS',
+      'Access-Control-Allow-Headers': 'X-Requested-With, content-type, Authorization',
+    },
+  },
+})

data/lib/middleman-webpacked/template/prod.webpack.tt

@@ -0,0 +1,6 @@
+const merge = require('webpack-merge')
+const sharedConfig = require('./shared.js')
+
+module.exports = merge(sharedConfig, {
+  devtool: false
+})

data/lib/middleman-webpacked/template/shared.webpack.tt

@@ -0,0 +1,12 @@
+module.exports = {
+  module: {
+    rules: [
+      <%- @loaders.map do |loader| %>
+      {
+        test: <%= loader[:test].inspect %>,
+        use: "<%= loader[:use] %>"
+      }
+      <% end.join(',') %>
+    ]
+  }
+}

data/lib/middleman-webpacked/version.rb

@@ -1,3 +1,3 @@
 module MiddlemanWebpacked
-  VERSION = '0.0.2'
+  VERSION = '0.0.3'
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: middleman-webpacked
 version: !ruby/object:Gem::Version
-  version: 0.0.2
+  version: 0.0.3
 platform: ruby
 authors:
 - Aotokitsuruya
@@ -37,8 +37,15 @@ files:
 - Rakefile
 - features/support/env.rb
 - lib/middleman-webpacked.rb
+- lib/middleman-webpacked/build.rb
+- lib/middleman-webpacked/command_runner.rb
 - lib/middleman-webpacked/commands/webpack.rb
 - lib/middleman-webpacked/extension.rb
+- lib/middleman-webpacked/server.rb
+- lib/middleman-webpacked/template/babelrc.tt
+- lib/middleman-webpacked/template/dev.webpack.tt
+- lib/middleman-webpacked/template/prod.webpack.tt
+- lib/middleman-webpacked/template/shared.webpack.tt
 - lib/middleman-webpacked/version.rb
 - middleman-webpacked.gemspec
 homepage: https://github.com/elct9620/middleman-webpacked