webpacker 3.0.2 → 3.1.0

data/lib/webpacker/dev_server_proxy.rb

@@ -9,8 +9,9 @@ class Webpacker::DevServerProxy < Rack::Proxy
   end
 
   def perform_request(env)
-    if env["PATH_INFO"] =~ /#{public_output_uri_path}/ && Webpacker.dev_server.running?
+    if env["PATH_INFO"].start_with?("/#{public_output_uri_path}") && Webpacker.dev_server.running?
       env["HTTP_HOST"] = env["HTTP_X_FORWARDED_HOST"] = env["HTTP_X_FORWARDED_SERVER"] = Webpacker.dev_server.host_with_port
+      env["SCRIPT_NAME"] = ""
 
       super(env)
     else

data/lib/webpacker/dev_server_runner.rb

@@ -18,10 +18,11 @@ module Webpacker
 
         @hostname          = dev_server["host"]
         @port              = dev_server["port"]
+        @pretty            = dev_server.fetch("pretty", true)
 
       rescue Errno::ENOENT, NoMethodError
-        $stdout.puts "Webpack dev_server configuration not found in #{@config_file}."
-        $stdout.puts "Please run bundle exec rails webpacker:install to install webpacker"
+        $stdout.puts "webpack dev_server configuration not found in #{@config_file}."
+        $stdout.puts "Please run bundle exec rails webpacker:install to install Webpacker"
         exit!
       end
 
@@ -38,10 +39,9 @@ module Webpacker
         env = { "NODE_PATH" => @node_modules_path.shellescape }
         cmd = [
           "#{@node_modules_path}/.bin/webpack-dev-server",
-          "--progress",
-          "--color",
           "--config", @webpack_config
         ]
+        cmd += ["--progress", "--color"] if @pretty
 
         Dir.chdir(@app_path) do
           exec env, *cmd

data/lib/webpacker/helper.rb

@@ -1,5 +1,5 @@
 module Webpacker::Helper
-  # Computes the full path for a given webpacker asset.
+  # Computes the full path for a given Webpacker asset.
   # Return relative path using manifest.json and passes it to asset_url helper
   # This will use asset_path internally, so most of their behaviors will be the same.
   #
@@ -9,7 +9,7 @@ module Webpacker::Helper
   def asset_pack_path(name, **options)
     asset_path(Webpacker.manifest.lookup!(name), **options)
   end
-  # Creates a script tag that references the named pack file, as compiled by Webpack per the entries list
+  # 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.
   #
@@ -21,7 +21,7 @@ module Webpacker::Helper
     javascript_include_tag(*sources_from_pack_manifest(names, type: :javascript), **options)
   end
 
-  # Creates a link tag that references the named pack file, as compiled by Webpack per the entries list
+  # 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.
   #

data/lib/webpacker/manifest.rb

@@ -49,9 +49,9 @@ class Webpacker::Manifest
 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.
+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.
+4. Your webpack configuration is not creating a manifest.
 Your manifest contains:
 #{JSON.pretty_generate(@data)}
       MSG

data/lib/webpacker/railtie.rb

@@ -4,6 +4,45 @@ require "webpacker/helper"
 require "webpacker/dev_server_proxy"
 
 class Webpacker::Engine < ::Rails::Engine
+  # Allows Webpacker config values to be set via Rails env config files
+  config.webpacker = ActiveSupport::OrderedOptions.new
+  config.webpacker.check_yarn_integrity = false
+
+  # ================================
+  # Check Yarn Integrity Initializer
+  # ================================
+  #
+  # development (on by default):
+  #
+  #    to turn off:
+  #     - edit config/environments/development.rb
+  #     - add `config.webpacker.check_yarn_integrity = false`
+  #
+  # production (off by default):
+  #
+  #    to turn on:
+  #     - edit config/environments/production.rb
+  #     - add `config.webpacker.check_yarn_integrity = false`
+  initializer "webpacker.yarn_check" do |app|
+    if File.exist?("yarn.lock") && app.config.webpacker.check_yarn_integrity
+      ok = system("yarn check --integrity")
+
+      if !ok
+        warn "\n\n"
+        warn "========================================"
+        warn "  Your Yarn packages are out of date!"
+        warn "  Please run `yarn install` to update."
+        warn "========================================"
+        warn "\n\n"
+        warn "To disable this check, please add `config.webpacker.check_yarn_integrity = false`"
+        warn "to your Rails development config file (config/environments/development.rb)."
+        warn "\n\n"
+
+        exit(1)
+      end
+    end
+  end
+
   initializer "webpacker.proxy" do |app|
     if Rails.env.development?
       app.middleware.insert_before 0,
@@ -12,7 +51,7 @@ class Webpacker::Engine < ::Rails::Engine
     end
   end
 
-  initializer "webpacker.helper" do |app|
+  initializer "webpacker.helper" do
     ActiveSupport.on_load :action_controller do
       ActionController::Base.helper Webpacker::Helper
     end
@@ -23,7 +62,7 @@ class Webpacker::Engine < ::Rails::Engine
   end
 
   initializer "webpacker.logger" do
-    config.after_initialize do |app|
+    config.after_initialize do
       if ::Rails.logger.respond_to?(:tagged)
         Webpacker.logger = ::Rails.logger
       else

data/lib/webpacker/runner.rb

@@ -14,7 +14,7 @@ module Webpacker
       @webpack_config    = File.join(@app_path, "config/webpack/#{ENV["NODE_ENV"]}.js")
 
       unless File.exist?(@webpack_config)
-        puts "Webpack config #{@webpack_config} not found, please run 'bundle exec rails webpacker:install' to install webpacker with default configs or add the missing config file for your custom environment."
+        $stderr.puts "webpack config #{@webpack_config} not found, please run 'bundle exec rails webpacker:install' to install Webpacker with default configs or add the missing config file for your custom environment."
         exit!
       end
     end

data/lib/webpacker/version.rb

@@ -1,4 +1,4 @@
 module Webpacker
   # Change the version in package.json too, please!
-  VERSION = "3.0.2".freeze
+  VERSION = "3.1.0".freeze
 end

data/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@rails/webpacker",
-  "version": "3.0.2",
-  "description": "Use Webpack to manage app-like JavaScript modules in Rails",
+  "version": "3.1.0",
+  "description": "Use webpack to manage app-like JavaScript modules in Rails",
   "main": "package/index.js",
   "files": [
     "package"
@@ -17,38 +17,46 @@
     "babel-plugin-transform-class-properties": "^6.24.1",
     "babel-plugin-transform-object-rest-spread": "^6.26.0",
     "babel-polyfill": "^6.26.0",
-    "babel-preset-env": "^1.6.0",
-    "coffee-loader": "^0.8.0",
-    "compression-webpack-plugin": "^1.0.0",
-    "css-loader": "^0.28.5",
-    "extract-text-webpack-plugin": "^3.0.0",
-    "file-loader": "^0.11.2",
+    "babel-preset-env": "^1.6.1",
+    "case-sensitive-paths-webpack-plugin": "^2.1.1",
+    "coffee-loader": "^0.9.0",
+    "compression-webpack-plugin": "^1.0.1",
+    "css-loader": "^0.28.7",
+    "extract-text-webpack-plugin": "^3.0.2",
+    "file-loader": "^1.1.5",
     "glob": "^7.1.2",
-    "js-yaml": "^3.9.1",
-    "node-sass": "^4.5.3",
+    "js-yaml": "^3.10.0",
+    "node-sass": "^4.7.2",
     "path-complete-extname": "^0.1.0",
     "postcss-cssnext": "^3.0.2",
-    "postcss-loader": "^2.0.6",
+    "postcss-loader": "^2.0.9",
     "postcss-smart-import": "^0.7.5",
     "rails-erb-loader": "^5.2.1",
-    "resolve-url-loader": "^2.1.0",
     "sass-loader": "^6.0.6",
-    "style-loader": "^0.18.2",
-    "webpack": "^3.5.5",
-    "webpack-manifest-plugin": "^1.3.1"
+    "style-loader": "^0.19.0",
+    "url-loader": "^0.6.2",
+    "webpack": "^3.8.1",
+    "webpack-manifest-plugin": "^1.3.2"
   },
   "devDependencies": {
-    "eslint": "^3.16.1",
-    "eslint-config-airbnb": "^14.1.0",
-    "eslint-plugin-import": "^2.2.0",
-    "eslint-plugin-jsx-a11y": "^4.0.0",
-    "eslint-plugin-react": "^6.10.0"
+    "eslint": "^4.11.0",
+    "eslint-config-airbnb": "^16.1.0",
+    "eslint-plugin-import": "^2.8.0",
+    "eslint-plugin-jsx-a11y": "^6.0.2",
+    "eslint-plugin-react": "^7.5.1",
+    "jest": "^21.2.1"
+  },
+  "jest": {
+    "testRegex": "(/__tests__/.*|(\\.|/))\\.jsx?$",
+    "roots": [
+      "<rootDir>/package"
+    ]
   },
   "peerDependencies": {
     "coffeescript": ">= 1.12.7 || >= 2.x"
   },
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
+    "test": "jest",
     "lint": "eslint {package,lib}/"
   },
   "repository": {

data/package/asset_host.js

@@ -1,11 +1,10 @@
 const config = require('./config')
 const { resolve } = require('path')
 
-function removeOuterSlashes(string) {
-  return string.replace(/^\/*/, '').replace(/\/*$/, '')
-}
+const removeOuterSlashes = string =>
+  string.replace(/^\/*/, '').replace(/\/*$/, '')
 
-function formatPublicPath(host = '', path = '') {
+const formatPublicPath = (host = '', path = '') => {
   let formattedHost = removeOuterSlashes(host)
   if (formattedHost && !/^http/i.test(formattedHost)) {
     formattedHost = `//${formattedHost}`
@@ -17,5 +16,5 @@ function formatPublicPath(host = '', path = '') {
 module.exports = {
   path: resolve('public', config.public_output_path),
   publicPath: `/${config.public_output_path}/`.replace(/([^:]\/)\/+/g, '$1'),
-  publicPathWithHost: formatPublicPath(process.env.ASSET_HOST, config.public_output_path)
+  publicPathWithHost: formatPublicPath(process.env.WEBPACKER_ASSET_HOST, config.public_output_path)
 }

data/package/config.js

@@ -1,9 +1,15 @@
 const { resolve } = require('path')
 const { safeLoad } = require('js-yaml')
 const { readFileSync } = require('fs')
+const deepMerge = require('./utils/deep_merge')
 
+const defaultFilePath = require.resolve('../lib/install/config/webpacker.yml')
 const filePath = resolve('config', 'webpacker.yml')
-const config = safeLoad(readFileSync(filePath), 'utf8')[process.env.NODE_ENV]
+
+const environment = process.env.NODE_ENV || 'development'
+const defaultConfig = safeLoad(readFileSync(defaultFilePath), 'utf8')[environment]
+const appConfig = safeLoad(readFileSync(filePath), 'utf8')[environment]
+const config = deepMerge(defaultConfig, appConfig)
 
 const isBoolean = str => /^true/.test(str) || /^false/.test(str)
 

data/package/config_types/__tests__/config_list.js

@@ -0,0 +1,123 @@
+/* global test expect */
+
+const ConfigList = require('../config_list')
+
+test('new', () => {
+  const list = new ConfigList()
+  expect(list).toBeInstanceOf(ConfigList)
+  expect(list).toBeInstanceOf(Array)
+})
+
+test('set', () => {
+  const list = new ConfigList()
+  expect(list.set('key', 'value')).toEqual([{ key: 'key', value: 'value' }])
+})
+
+test('get', () => {
+  const list = new ConfigList()
+  list.append('key', 'value')
+  expect(list.get('key')).toEqual('value')
+})
+
+test('append', () => {
+  const list = new ConfigList()
+  list.append('key', 'value')
+  expect(list.append('key1', 'value1')).toEqual([
+    { key: 'key', value: 'value' },
+    { key: 'key1', value: 'value1' }
+  ])
+})
+
+test('prepend', () => {
+  const list = new ConfigList()
+  list.append('key', 'value')
+  expect(list.prepend('key1', 'value1')).toEqual([
+    { key: 'key1', value: 'value1' },
+    { key: 'key', value: 'value' }
+  ])
+})
+
+test('insert without position', () => {
+  const list = new ConfigList()
+  list.append('key', 'value')
+
+  expect(list.insert('key1', 'value1')).toEqual([
+    { key: 'key', value: 'value' },
+    { key: 'key1', value: 'value1' }
+  ])
+
+  expect(list.insert('key2', 'value2')).toEqual([
+    { key: 'key', value: 'value' },
+    { key: 'key1', value: 'value1' },
+    { key: 'key2', value: 'value2' }
+  ])
+})
+
+test('insert before an item', () => {
+  const list = new ConfigList()
+  list.append('key', 'value')
+  list.append('key1', 'value1')
+
+  expect(list.insert('key2', 'value2', { before: 'key' })).toEqual([
+    { key: 'key2', value: 'value2' },
+    { key: 'key', value: 'value' },
+    { key: 'key1', value: 'value1' }
+  ])
+
+  expect(list.insert('key3', 'value3', { before: 'key2' })).toEqual([
+    { key: 'key3', value: 'value3' },
+    { key: 'key2', value: 'value2' },
+    { key: 'key', value: 'value' },
+    { key: 'key1', value: 'value1' }
+  ])
+})
+
+test('insert after an item', () => {
+  const list = new ConfigList()
+  list.append('key', 'value')
+  list.append('key1', 'value1')
+
+  expect(list.insert('key2', 'value2', { after: 'key' })).toEqual([
+    { key: 'key', value: 'value' },
+    { key: 'key2', value: 'value2' },
+    { key: 'key1', value: 'value1' }
+  ])
+
+  expect(list.insert('key3', 'value3', { after: 'key2' })).toEqual([
+    { key: 'key', value: 'value' },
+    { key: 'key2', value: 'value2' },
+    { key: 'key3', value: 'value3' },
+    { key: 'key1', value: 'value1' }
+  ])
+})
+
+test('delete', () => {
+  const list = new ConfigList()
+  list.append('key', 'value')
+  list.append('key1', 'value1')
+  expect(list.delete('key')).toEqual([{ key: 'key1', value: 'value1' }])
+  expect(list.delete('key1')).toEqual([])
+})
+
+test('getIndex', () => {
+  const list = new ConfigList()
+  list.append('key', 'value')
+  list.append('key1', 'value1')
+  expect(list.getIndex('key')).toEqual(0)
+  expect(list.getIndex('key2')).toEqual(-1)
+  expect(() => list.getIndex('key2', true)).toThrow('Item key2 not found')
+})
+
+test('values', () => {
+  const list = new ConfigList()
+  list.append('key', 'value')
+  list.append('key1', 'value1')
+  expect(list.values()).toEqual(['value', 'value1'])
+})
+
+test('keys', () => {
+  const list = new ConfigList()
+  list.append('key', 'value')
+  list.append('key1', 'value1')
+  expect(list.keys()).toEqual(['key', 'key1'])
+})

data/package/config_types/__tests__/config_object.js

@@ -0,0 +1,43 @@
+/* global test expect */
+
+const ConfigObject = require('../config_object')
+
+test('new', () => {
+  const object = new ConfigObject()
+  expect(object).toBeInstanceOf(ConfigObject)
+  expect(object).toBeInstanceOf(Object)
+})
+
+test('set', () => {
+  const object = new ConfigObject()
+  expect(object.set('key', 'value')).toEqual({ key: 'value' })
+})
+
+test('get', () => {
+  const object = new ConfigObject()
+  object.set('key', 'value')
+  object.set('key1', 'value1')
+  expect(object.get('key')).toEqual('value')
+})
+
+test('delete', () => {
+  const object = new ConfigObject()
+  object.set('key', { key1: 'value' })
+  expect(object.delete('key.key1')).toEqual({ key: {} })
+  expect(object.delete('key')).toEqual({})
+})
+
+test('toObject', () => {
+  const object = new ConfigObject()
+  object.set('key', 'value')
+  object.set('key1', 'value1')
+  expect(object.toObject()).toEqual({ key: 'value', key1: 'value1' })
+})
+
+test('merge', () => {
+  const object = new ConfigObject()
+  object.set('foo', {})
+  expect(object.merge({ key: 'foo', value: 'bar' })).toEqual(
+    { foo: {}, key: 'foo', value: 'bar' }
+  )
+})

data/package/config_types/config_list.js

@@ -0,0 +1,83 @@
+/**
+  * @class
+  * @extends { Array }
+*/
+class ConfigList extends Array {
+  get(key) {
+    const index = this.getIndex(key, true)
+    return this[index].value
+  }
+
+  /**
+    * @deprecated after the 3.0.2 release and will be removed in the next major release
+  */
+  set(key, value) {
+    /* eslint no-console: 0 */
+    console.warn('set is deprecated! Use append instead')
+    return this.append(key, value)
+  }
+
+  append(key, value) {
+    return this.add({ key, value })
+  }
+
+  prepend(key, value) {
+    return this.add({ key, value }, 'prepend')
+  }
+
+  insert(key, value, pos = {}) {
+    if (!(pos.before || pos.after)) return this.append(key, value)
+
+    const currentIndex = this.getIndex(key)
+    if (currentIndex >= 0) this.splice(currentIndex, 1)
+
+    let newIndex = this.getIndex(pos.before || pos.after)
+    if (pos.after) newIndex += 1
+
+    this.splice(newIndex, 0, { key, value })
+    return this
+  }
+
+  delete(key) {
+    const index = this.getIndex(key, true)
+    this.splice(index, 1)
+    return this
+  }
+
+  getIndex(key, shouldThrow = false) {
+    const index = this.findIndex(entry =>
+      (
+        entry === key ||
+        entry.key === key ||
+        (entry.constructor && entry.constructor.name === key)
+      ))
+
+    if (shouldThrow && index < 0) throw new Error(`Item ${key} not found`)
+    return index
+  }
+
+  add({ key, value }, strategy = 'append') {
+    const index = this.getIndex(key)
+    if (index >= 0) this.delete(key)
+
+    switch (strategy) {
+      case 'prepend':
+        this.unshift({ key, value })
+        break
+      default:
+        this.push({ key, value })
+    }
+
+    return this
+  }
+
+  values() {
+    return this.map(item => item.value)
+  }
+
+  keys() {
+    return this.map(item => item.key)
+  }
+}
+
+module.exports = ConfigList