webpacker 3.1.1 → 3.2.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 720fa717b75c3fe4a1729f826d54a80b502937fd
-  data.tar.gz: 99d55971228f24ebe7cec9a9deda91d30d9d1c56
+  metadata.gz: b2f0cc346a219b0ec7cbf6e7a8742a5d2357e688
+  data.tar.gz: 22cfe110c400664e867746d12872f16c0aab2ea6
 SHA512:
-  metadata.gz: 88e6dafb821268be55f60904f1c1fbf82b2bb445790232130a9921cef5d155f2d5598c650c3792711b989897de68bcddc86e429f4b6718cbb2f28db5578d3211
-  data.tar.gz: 2ad1085b3937f9a27f1e352689a17fe2372e03baa97ecc4615aaafa3f93e919cf15ac620962b152a41c91efb45430d5fb5d07e51624bfcdeee41d269217f86dc
+  metadata.gz: be0bae989d22432883152e3623edd818cfbaf8845b539424cf9acc94c69e9a7aec0eda791f650cab2509e76ddf871c44db8bbe5dabda795ee44db3fd6ccf1197
+  data.tar.gz: 86f02ab54817cae201d65463d9b17d7966c427bec9f2763041a29691b4410e2c33fa7fb2dd2cd8375f111408ccc01b57e85820955fa7e6c9c72272a632dcd86f

data/CHANGELOG.md

@@ -1,3 +1,80 @@
+**Please note that Webpacker 3.1.0 and 3.1.1 has some serious bugs so please consider using either 3.0.2 or 3.2.0**
+
+## [3.2.0] - 2017-12-16
+
+### To upgrade:
+
+```bash
+bundle update webpacker
+yarn upgrade @rails/webpacker
+```
+
+### Breaking changes
+
+If you are using react, vue, angular, elm, erb or coffeescript inside your
+`packs/` please re-run the integration installers as described in the README.
+
+```bash
+bundle exec rails webpacker:install:react
+bundle exec rails webpacker:install:vue
+bundle exec rails webpacker:install:angular
+bundle exec rails webpacker:install:elm
+bundle exec rails webpacker:install:erb
+bundle exec rails webpacker:install::coffee
+```
+
+Or simply copy required loaders used in your app from
+https://github.com/rails/webpacker/tree/master/lib/install/loaders
+into your `config/webpack/loaders/`
+directory and add it to webpack build from `config/webpack/environment.js`
+
+```js
+const erb =  require('./loaders/erb')
+const elm =  require('./loaders/elm')
+const typescript =  require('./loaders/typescript')
+const vue =  require('./loaders/vue')
+const coffee =  require('./loaders/coffee')
+
+environment.loaders.append('coffee', coffee)
+environment.loaders.append('vue', vue)
+environment.loaders.append('typescript', typescript)
+environment.loaders.append('elm', elm)
+environment.loaders.append('erb', erb)
+```
+
+### Added (npm module)
+
+- Upgrade gems and webpack dependencies
+
+- `postcss-import` in place of `postcss-smart-import`
+
+
+### Removed (npm module)
+
+- `postcss-smart-import`, `coffee-loader`, `url-loader`, `rails-erb-loader` as dependencies
+
+-  `publicPath` from file loader [#1107](https://github.com/rails/webpacker/pull/1107)
+
+
+### Fixed (npm module)
+
+- Return native array type for `ConfigList` [#1098](https://github.com/rails/webpacker/pull/1098)
+
+
+### Added (Gem)
+
+- New `asset_pack_url` helper [#1102](https://github.com/rails/webpacker/pull/1102)
+
+- New installers for coffee and erb
+
+```bash
+bundle exec rails webpacker:install:erb
+bundle exec rails webpacker:install::coffee
+```
+
+- Resolved paths from webpacker.yml to compiler watched list
+
+
 ## [3.1.1] - 2017-12-11
 
 ### Fixed

data/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    webpacker (3.1.1)
+    webpacker (3.2.0)
       activesupport (>= 4.2)
       rack-proxy (>= 0.6.1)
       railties (>= 4.2)
@@ -51,33 +51,32 @@ GEM
     builder (3.2.3)
     byebug (9.1.0)
     concurrent-ruby (1.0.5)
-    crass (1.0.2)
-    erubi (1.6.1)
-    globalid (0.4.0)
+    crass (1.0.3)
+    erubi (1.7.0)
+    globalid (0.4.1)
       activesupport (>= 4.2.0)
-    i18n (0.8.6)
+    i18n (0.9.1)
+      concurrent-ruby (~> 1.0)
     loofah (2.1.1)
       crass (~> 1.0.2)
       nokogiri (>= 1.5.9)
-    mail (2.6.6)
-      mime-types (>= 1.16, < 4)
+    mail (2.7.0)
+      mini_mime (>= 0.1.1)
     method_source (0.9.0)
-    mime-types (3.1)
-      mime-types-data (~> 3.2015)
-    mime-types-data (3.2016.0521)
+    mini_mime (1.0.0)
     mini_portile2 (2.3.0)
     minitest (5.10.3)
     nio4r (2.1.0)
     nokogiri (1.8.1)
       mini_portile2 (~> 2.3.0)
     parallel (1.12.0)
-    parser (2.4.0.0)
-      ast (~> 2.2)
+    parser (2.4.0.2)
+      ast (~> 2.3)
     powerpack (0.1.1)
     rack (2.0.3)
-    rack-proxy (0.6.2)
+    rack-proxy (0.6.3)
       rack
-    rack-test (0.7.0)
+    rack-test (0.8.2)
       rack (>= 1.0, < 3)
     rails (5.1.4)
       actioncable (= 5.1.4)
@@ -104,8 +103,8 @@ GEM
       thor (>= 0.18.1, < 2.0)
     rainbow (2.2.2)
       rake
-    rake (12.1.0)
-    rubocop (0.50.0)
+    rake (12.3.0)
+    rubocop (0.51.0)
       parallel (~> 1.10)
       parser (>= 2.3.3.1, < 3.0)
       powerpack (~> 0.1)
@@ -122,12 +121,12 @@ GEM
       sprockets (>= 3.0.0)
     thor (0.20.0)
     thread_safe (0.3.6)
-    tzinfo (1.2.3)
+    tzinfo (1.2.4)
       thread_safe (~> 0.1)
     unicode-display_width (1.3.0)
     websocket-driver (0.6.5)
       websocket-extensions (>= 0.1.0)
-    websocket-extensions (0.1.2)
+    websocket-extensions (0.1.3)
 
 PLATFORMS
   ruby

data/README.md

@@ -30,6 +30,8 @@ in which case you may not even need the asset pipeline. This is mostly relevant
   - [Angular with TypeScript](#angular-with-typescript)
   - [Vue](#vue)
   - [Elm](#elm)
+  - [Coffeescript](#coffeescript)
+  - [Erb](#erb)
 - [Paths](#paths)
   - [Resolved](#resolved)
   - [Watched](#watched)
@@ -323,6 +325,25 @@ The Elm library and core packages will be added via Yarn and Elm itself.
 An example `Main.elm` app will also be added to your project in `app/javascript`
 so that you can experiment with Elm right away.
 
+### Coffeescript
+
+To add [Coffeescript](http://coffeescript.org/) support,
+run `bundle exec rails webpacker:install:coffee` on a Rails app already
+setup with Webpacker.
+
+An example `hello_coffee.coffee` file will also be added to your project
+in `app/javascript/packs` so that you can experiment with Coffeescript right away.
+
+### Erb
+
+To add [Erb](https://apidock.com/ruby/ERB) support in your JS templates,
+run `bundle exec rails webpacker:install:erb` on a Rails app already
+setup with Webpacker.
+
+An example `hello_erb.js.erb` file will also be added to your project
+in `app/javascript/packs` so that you can experiment with Erb flavoured
+javascript right away.
+
 
 ## Paths
 

data/docs/css.md

@@ -77,7 +77,7 @@ file in your app root with standard plugins.
 
 ```yml
 plugins:
-  postcss-smart-import: {}
+  postcss-import: {}
   postcss-cssnext: {}
 ```
 
@@ -106,6 +106,11 @@ yarn add resolve-url-loader
 // webpack/environment.js
 const { environment } = require('@rails/webpacker')
 
-const sassLoader = environment.loaders.get('sass')
-sassLoader.use.push({ loader: 'resolve-url-loader' })
+// resolve-url-loader must be used before sass-loader
+environment.loaders.get('sass').use.splice(-1, 0, {
+  loader: 'resolve-url-loader',
+  options: {
+    attempts: 1
+  }
+});
 ```

data/docs/troubleshooting.md

@@ -99,3 +99,21 @@ Rails.application.config.assets.js_compressor = :uglifier
 #Rails.application.config.assets.js_compressor = :uglifier
 
 ```
+
+### Angular: WARNING in ./node_modules/@angular/core/esm5/core.js, Critical dependency: the request of a dependency is an expression
+
+To silent these warnings, please update `config/webpack/environment.js`
+
+```js
+// environment.js
+const webpack = require('webpack')
+const { resolve } = require('path')
+const { environment, config } = require('@rails/webpacker')
+
+environment.plugins.set('ContextReplacement',
+  new webpack.ContextReplacementPlugin(
+    /angular(\\|\/)core(\\|\/)(@angular|esm5)/,
+    resolve(config.source_path)
+  )
+)
+```

data/docs/webpack.md

@@ -49,9 +49,9 @@ If you need access to configs within Webpacker's configuration,
 you can import them like so:
 
 ```js
-const { config, asset_host } = require('@rails/webpacker')
+const { config } = require('@rails/webpacker')
 
-console.log(asset_host.publicPathWithHost)
+console.log(config.output_path)
 console.log(config.source_path)
 ```
 
@@ -145,6 +145,33 @@ environment.loaders.insert('svg', {
 }, { before: 'file' })
 ```
 
+
+### Url Loader
+
+```js
+// config/webpack/loaders/url.js
+
+const { assetHost } = require('@rails/webpacker')
+
+module.exports = {
+  test: [/\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/],
+  use: [{
+    loader: 'url-loader',
+    options: {
+      limit: 10000,
+      name: '[name]-[hash].[ext]',
+      publicPath: assetHost.publicPathWithHost
+    }
+  }]
+}
+
+// config/webpack/environment.js
+
+const { environment } = require('@rails/webpacker')
+
+environment.loaders.prepend('url', url)
+```
+
 ### Overriding Loader Options in webpack 3+ (for CSS Modules etc.)
 
 In webpack 3+, if you'd like to specify additional or different options for a loader, edit `config/webpack/environment.js` and provide an options object to override. This is similar to the technique shown above, but the following example shows specifically how to apply CSS Modules, which is what you may be looking for:
@@ -159,7 +186,7 @@ const myCssLoaderOptions = {
   localIdentName: '[name]__[local]___[hash:base64:5]'
 }
 
-const CSSLoader = environment.loaders.get('style').use.find(el => el.loader === 'css-loader')
+const CSSLoader = environment.loaders.get('sass').use.find(el => el.loader === 'css-loader')
 
 CSSLoader.options = merge(CSSLoader.options, myCssLoaderOptions)
 

data/lib/install/angular.rb

@@ -1,5 +1,17 @@
 require "webpacker/configuration"
 
+say "Copying angular loader to config/webpack/loaders"
+copy_file "#{__dir__}/loaders/typescript.js", Rails.root.join("config/webpack/loaders/typescript.js").to_s
+
+say "Adding typescript loader to config/webpack/environment.js"
+insert_into_file Rails.root.join("config/webpack/environment.js").to_s,
+  "const typescript =  require('./loaders/typescript')\n",
+  after: "require('@rails/webpacker')\n"
+
+insert_into_file Rails.root.join("config/webpack/environment.js").to_s,
+  "environment.loaders.append('typescript', typescript)\n",
+  before: "module.exports"
+
 say "Copying angular example entry file to #{Webpacker.config.source_entry_path}"
 copy_file "#{__dir__}/examples/angular/hello_angular.js", "#{Webpacker.config.source_entry_path}/hello_angular.js"
 

data/lib/install/coffee.rb

@@ -0,0 +1,22 @@
+require "webpacker/configuration"
+
+say "Copying coffee loader to config/webpack/loaders"
+copy_file "#{__dir__}/loaders/coffee.js", Rails.root.join("config/webpack/loaders/coffee.js").to_s
+
+say "Adding coffee loader to config/webpack/environment.js"
+insert_into_file Rails.root.join("config/webpack/environment.js").to_s,
+  "const coffee =  require('./loaders/coffee')\n",
+  after: "require('@rails/webpacker')\n"
+
+insert_into_file Rails.root.join("config/webpack/environment.js").to_s,
+  "environment.loaders.append('coffee', coffee)\n",
+  before: "module.exports"
+
+say "Copying the example entry file to #{Webpacker.config.source_entry_path}"
+copy_file "#{__dir__}/examples/coffee/hello_coffee.coffee",
+  "#{Webpacker.config.source_entry_path}/hello_coffee.coffee"
+
+say "Installing all Coffeescript dependencies"
+run "yarn add coffeescript@1.12.7 coffee-loader"
+
+say "Webpacker now supports Coffeeescript 🎉", :green

data/lib/install/config/.postcssrc.yml

@@ -1,3 +1,3 @@
 plugins:
-  postcss-smart-import: {}
+  postcss-import: {}
   postcss-cssnext: {}

data/lib/install/elm.rb

@@ -1,5 +1,17 @@
 require "webpacker/configuration"
 
+say "Copying elm loader to config/webpack/loaders"
+copy_file "#{__dir__}/loaders/elm.js", Rails.root.join("config/webpack/loaders/elm.js").to_s
+
+say "Adding elm loader to config/webpack/environment.js"
+insert_into_file Rails.root.join("config/webpack/environment.js").to_s,
+  "const elm =  require('./loaders/elm')\n",
+  after: "require('@rails/webpacker')\n"
+
+insert_into_file Rails.root.join("config/webpack/environment.js").to_s,
+  "environment.loaders.append('elm', elm)\n",
+  before: "module.exports"
+
 say "Copying Elm example entry file to #{Webpacker.config.source_entry_path}"
 copy_file "#{__dir__}/examples/elm/hello_elm.js",
   "#{Webpacker.config.source_entry_path}/hello_elm.js"

data/lib/install/erb.rb

@@ -0,0 +1,22 @@
+require "webpacker/configuration"
+
+say "Copying vue loader to config/webpack/loaders"
+copy_file "#{__dir__}/loaders/erb.js", Rails.root.join("config/webpack/loaders/erb.js").to_s
+
+say "Adding erb loader to config/webpack/environment.js"
+insert_into_file Rails.root.join("config/webpack/environment.js").to_s,
+  "const erb =  require('./loaders/erb')\n",
+  after: "require('@rails/webpacker')\n"
+
+insert_into_file Rails.root.join("config/webpack/environment.js").to_s,
+  "environment.loaders.append('erb', erb)\n",
+  before: "module.exports"
+
+say "Copying the example entry file to #{Webpacker.config.source_entry_path}"
+copy_file "#{__dir__}/examples/erb/hello_erb.js.erb",
+  "#{Webpacker.config.source_entry_path}/hello_erb.js.erb"
+
+say "Installing all Erb dependencies"
+run "yarn add rails-erb-loader"
+
+say "Webpacker now supports Erb in JS 🎉", :green

data/lib/install/examples/coffee/hello_coffee.coffee

@@ -0,0 +1,4 @@
+# Run this example by adding <%%= javascript_pack_tag 'hello_coffee' %> to the head of your layout file,
+# like app/views/layouts/application.html.erb.
+
+console.log 'Hello world from coffeescript'

data/lib/install/examples/erb/hello_erb.js.erb

@@ -0,0 +1,6 @@
+// Run this example by adding <%%= javascript_pack_tag 'hello_erb' %> to the head of your layout file,
+// like app/views/layouts/application.html.erb.
+
+<% name = 'Erb' %>
+
+console.log('Hello world from <%= name %>')

data/{package/rules → lib/install/loaders}/vue.js

@@ -1,4 +1,4 @@
-const { dev_server: devServer } = require('../config')
+const { dev_server: devServer } = require('@rails/webpacker').config
 
 const isProduction = process.env.NODE_ENV === 'production'
 const inDevServer = process.argv.find(v => v.includes('webpack-dev-server'))

data/lib/install/vue.rb

@@ -1,5 +1,17 @@
 require "webpacker/configuration"
 
+say "Copying vue loader to config/webpack/loaders"
+copy_file "#{__dir__}/loaders/vue.js", Rails.root.join("config/webpack/loaders/vue.js").to_s
+
+say "Adding vue loader to config/webpack/environment.js"
+insert_into_file Rails.root.join("config/webpack/environment.js").to_s,
+  "const vue =  require('./loaders/vue')\n",
+  after: "require('@rails/webpacker')\n"
+
+insert_into_file Rails.root.join("config/webpack/environment.js").to_s,
+  "environment.loaders.append('vue', vue)\n",
+  before: "module.exports"
+
 say "Copying the example entry file to #{Webpacker.config.source_entry_path}"
 copy_file "#{__dir__}/examples/vue/hello_vue.js",
   "#{Webpacker.config.source_entry_path}/hello_vue.js"