webpacker 3.2.0 → 3.2.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: b2f0cc346a219b0ec7cbf6e7a8742a5d2357e688
-  data.tar.gz: 22cfe110c400664e867746d12872f16c0aab2ea6
+  metadata.gz: 5a54f5131894092cf3a3c2176cca4c3d2d99cb10
+  data.tar.gz: 82eb7c75ef0ce343c7e8bb8b66efffb92d9ba252
 SHA512:
-  metadata.gz: be0bae989d22432883152e3623edd818cfbaf8845b539424cf9acc94c69e9a7aec0eda791f650cab2509e76ddf871c44db8bbe5dabda795ee44db3fd6ccf1197
-  data.tar.gz: 86f02ab54817cae201d65463d9b17d7966c427bec9f2763041a29691b4410e2c33fa7fb2dd2cd8375f111408ccc01b57e85820955fa7e6c9c72272a632dcd86f
+  metadata.gz: '088e85d9e4d9534b51b55ec1c69db1cbee256ac5d965c8b49ce2d9f1a1c92ccf17ef22432e58ac52ffb78629aa2708429e5ad39e0277a4917ec9412242ed64af'
+  data.tar.gz: fdeab469b4ce1d04d34f7a33a810c286c0783ff69f1c8e95d4f7664fea6f9f02e0b67c4bb0b71db76e2732c42d1ba8afa8c8ea9234dd69ea76671c706fb4600e

data/.gitignore

@@ -4,3 +4,6 @@
 node_modules
 .byebug_history
 /test/test_app/tmp
+yarn-debug.log*
+yarn-error.log*
+.yarn-integrity

data/.travis.yml

@@ -1,9 +1,12 @@
 sudo: false
 language: ruby
+before_install:
+  - gem update --system 
 rvm:
   - 2.2.8
   - 2.3.5
   - 2.4.2
+  - 2.5.0
   - ruby-head
 gemfile:
   - gemfiles/Gemfile-rails.4.2.x

data/CHANGELOG.md

@@ -1,5 +1,22 @@
 **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.1] - 2018-01-21
+
+- Disable dev server running? check if no dev server config is present in that environment [#1179](https://github.com/rails/webpacker/pull/1179)
+
+- Fix checking 'webpack' binstub on Windows [#1123](https://github.com/rails/webpacker/pull/1123)
+
+- silence yarn output if checking is successfull [#1131](https://github.com/rails/webpacker/pull/1131)
+
+- Update uglifyJs plugin to support ES6 [#1194](https://github.com/rails/webpacker/pull/1194)
+
+- Add typescript installer [#1145](https://github.com/rails/webpacker/pull/1145)
+
+- Update default extensions and move to installer [#1181](https://github.com/rails/webpacker/pull/1181)
+
+- Revert file loader [#1196](https://github.com/rails/webpacker/pull/1196)
+
+
 ## [3.2.0] - 2017-12-16
 
 ### To upgrade:
@@ -20,7 +37,7 @@ 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
+bundle exec rails webpacker:install:coffee
 ```
 
 Or simply copy required loaders used in your app from
@@ -42,6 +59,14 @@ environment.loaders.append('elm', elm)
 environment.loaders.append('erb', erb)
 ```
 
+In `.postcssrc.yml` you need to change the plugin name from `postcss-smart-import` to `postcss-import`:
+
+```yml
+plugins:
+  postcss-import: {}
+  postcss-cssnext: {}
+```
+
 ### Added (npm module)
 
 - Upgrade gems and webpack dependencies
@@ -69,7 +94,7 @@ environment.loaders.append('erb', erb)
 
 ```bash
 bundle exec rails webpacker:install:erb
-bundle exec rails webpacker:install::coffee
+bundle exec rails webpacker:install:coffee
 ```
 
 - Resolved paths from webpacker.yml to compiler watched list
@@ -143,7 +168,7 @@ files.
 const sassLoader = environment.loaders.get('sass')
 const cssLoader = sassLoader.use.find(loader => loader.loader === 'css-loader')
 
-cssLoader.options = Object.assign(cssLoader.options, {
+cssLoader.options = Object.assign({}, cssLoader.options, {
   modules: true,
   localIdentName: '[path][name]__[local]--[hash:base64:5]'
 })

data/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    webpacker (3.2.0)
+    webpacker (3.2.1)
       activesupport (>= 4.2)
       rack-proxy (>= 0.6.1)
       railties (>= 4.2)
@@ -65,11 +65,11 @@ GEM
     method_source (0.9.0)
     mini_mime (1.0.0)
     mini_portile2 (2.3.0)
-    minitest (5.10.3)
-    nio4r (2.1.0)
+    minitest (5.11.1)
+    nio4r (2.2.0)
     nokogiri (1.8.1)
       mini_portile2 (~> 2.3.0)
-    parallel (1.12.0)
+    parallel (1.12.1)
     parser (2.4.0.2)
       ast (~> 2.3)
     powerpack (0.1.1)
@@ -101,14 +101,13 @@ GEM
       method_source
       rake (>= 0.8.7)
       thor (>= 0.18.1, < 2.0)
-    rainbow (2.2.2)
-      rake
+    rainbow (3.0.0)
     rake (12.3.0)
-    rubocop (0.51.0)
+    rubocop (0.52.1)
       parallel (~> 1.10)
-      parser (>= 2.3.3.1, < 3.0)
+      parser (>= 2.4.0.2, < 3.0)
       powerpack (~> 0.1)
-      rainbow (>= 2.2.2, < 3.0)
+      rainbow (>= 2.2.2, < 4.0)
       ruby-progressbar (~> 1.7)
       unicode-display_width (~> 1.0, >= 1.0.1)
     ruby-progressbar (1.9.0)

data/docs/deployment.md

@@ -1,8 +1,8 @@
 # Deployment
 
 
-Webpacker hooks up a new `webpacker:compile` task to `assets:precompile`, which gets run whenever you run `assets:precompile`. If you are not using Sprockets you
-can manually trigger `bundle exec rails webpacker:compile` during your app deploy.
+Webpacker hooks up a new `webpacker:compile` task to `assets:precompile`, which gets run whenever you run `assets:precompile`. 
+If you are not using Sprockets `webpacker:compile` is automatically aliased to `assets:precompile`. Remember to set NODE_ENV environment variable to production during deployment or when running the rake task.
 
 The `javascript_pack_tag` and `stylesheet_pack_tag` helper method will automatically insert the correct HTML tag for compiled pack. Just like the asset pipeline does it.
 

data/docs/typescript.md

@@ -3,43 +3,15 @@
 
 ## Typescript with React
 
-1. Setup react using Webpacker [react installer](#react). Then add required depedencies
-for using typescript with React:
+1. Setup react using Webpacker [react installer](#react). Then run the typescript installer
 
 ```bash
-yarn add ts-loader typescript @types/react @types/react-dom
+bundle exec rails webpacker:install:typescript
+yarn add @types/react @types/react-dom
 ```
 
-2. Add a `tsconfig.json` to project root:
-
-``` json
-{
-  "compilerOptions": {
-    "declaration": false,
-    "emitDecoratorMetadata": true,
-    "experimentalDecorators": true,
-    "lib": ["es6", "dom"],
-    "module": "es6",
-    "moduleResolution": "node",
-    "sourceMap": true,
-    "jsx": "react",
-    "target": "es5"
-  },
-  "exclude": [
-    "**/*.spec.ts",
-    "node_modules",
-    "vendor",
-    "public"
-  ],
-  "compileOnSave": false
-}
-```
-
-3. Finally add `.tsx` to the list of extensions in `config/webpacker.yml`
-and rename your generated `hello_react.js` using react installer
-to `hello_react.tsx` and make it valid typescript and now you can use
-typescript, JSX with React.
-
+2. Rename the generated `hello_react.js` to `hello_react.tsx`. Make the file valid typescript and
+now you can use typescript, JSX with React.
 
 
 ## HTML templates with Typescript and Angular

data/docs/webpack.md

@@ -142,7 +142,10 @@ environment.loaders.insert('svg', {
       }
     }
   ])
-}, { before: 'file' })
+}, { after: 'file' })
+
+const fileLoader = environment.loaders.get('file')
+fileLoader.exclude = /\.(svg)$/i
 ```
 
 
@@ -151,16 +154,13 @@ environment.loaders.insert('svg', {
 ```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
+      name: '[name]-[hash].[ext]'
     }
   }]
 }

data/lib/install/angular.rb

@@ -1,27 +1,12 @@
 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"
 
 say "Copying hello_angular app to #{Webpacker.config.source_path}"
 directory "#{__dir__}/examples/angular/hello_angular", "#{Webpacker.config.source_path}/hello_angular"
 
-say "Copying tsconfig.json to the Rails root directory for typescript"
-copy_file "#{__dir__}/examples/angular/tsconfig.json", "tsconfig.json"
-
 say "Installing all angular dependencies"
-run "yarn add typescript ts-loader core-js zone.js rxjs @angular/core @angular/common @angular/compiler @angular/platform-browser @angular/platform-browser-dynamic"
+run "yarn add core-js zone.js rxjs @angular/core @angular/common @angular/compiler @angular/platform-browser @angular/platform-browser-dynamic"
 
-say "Webpacker now supports angular and typescript 🎉", :green
+say "Webpacker now supports angular 🎉", :green

data/lib/install/coffee.rb

@@ -12,6 +12,9 @@ insert_into_file Rails.root.join("config/webpack/environment.js").to_s,
   "environment.loaders.append('coffee', coffee)\n",
   before: "module.exports"
 
+say "Updating webpack paths to include .coffee file extension"
+insert_into_file Webpacker.config.config_path, "    - .coffee\n", after: /extensions:\n/
+
 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"

data/lib/install/config/webpacker.yml

@@ -14,12 +14,7 @@ default: &default
   cache_manifest: false
 
   extensions:
-    - .coffee
-    - .erb
     - .js
-    - .jsx
-    - .ts
-    - .vue
     - .sass
     - .scss
     - .css

data/lib/install/elm.rb

@@ -25,7 +25,7 @@ run "yarn add elm elm-webpack-loader"
 run "yarn add --dev elm-hot-loader"
 run "yarn run elm package install -- --yes"
 
-say "Updating webpack paths to include Elm file extension"
+say "Updating webpack paths to include .elm file extension"
 insert_into_file Webpacker.config.config_path, "    - .elm\n", after: /extensions:\n/
 
 say "Updating Elm source location"

data/lib/install/erb.rb

@@ -1,6 +1,6 @@
 require "webpacker/configuration"
 
-say "Copying vue loader to config/webpack/loaders"
+say "Copying erb 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"
@@ -12,6 +12,9 @@ insert_into_file Rails.root.join("config/webpack/environment.js").to_s,
   "environment.loaders.append('erb', erb)\n",
   before: "module.exports"
 
+say "Updating webpack paths to include .erb file extension"
+insert_into_file Webpacker.config.config_path, "    - .erb\n", after: /extensions:\n/
+
 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"

data/lib/install/examples/react/tsconfig.json

@@ -0,0 +1,20 @@
+{
+  "compilerOptions": {
+    "declaration": false,
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "lib": ["es6", "dom"],
+    "module": "es6",
+    "moduleResolution": "node",
+    "sourceMap": true,
+    "target": "es5",
+    "jsx": "react"
+  },
+  "exclude": [
+    "**/*.spec.ts",
+    "node_modules",
+    "vendor",
+    "public"
+  ],
+  "compileOnSave": false
+}

data/lib/install/examples/typescript/hello_typescript.ts

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

data/lib/install/examples/vue/hello_vue.js

@@ -9,10 +9,11 @@ import Vue from 'vue'
 import App from '../app.vue'
 
 document.addEventListener('DOMContentLoaded', () => {
-  document.body.appendChild(document.createElement('hello'))
+  const el = document.body.appendChild(document.createElement('hello'))
   const app = new Vue({
+    el,
     render: h => h(App)
-  }).$mount('hello')
+  })
 
   console.log(app)
 })

data/lib/install/loaders/elm.js

@@ -5,7 +5,7 @@ const elmSource = resolve(process.cwd())
 const elmMake = `${elmSource}/node_modules/.bin/elm-make`
 
 const elmDefaultOptions = { cwd: elmSource, pathToMake: elmMake }
-const developmentOptions = Object.assign(elmDefaultOptions, {
+const developmentOptions = Object.assign({}, elmDefaultOptions, {
   verbose: true,
   warn: true,
   debug: true

data/lib/install/react.rb

@@ -22,6 +22,9 @@ end
 say "Copying react example entry file to #{Webpacker.config.source_entry_path}"
 copy_file "#{__dir__}/examples/react/hello_react.jsx", "#{Webpacker.config.source_entry_path}/hello_react.jsx"
 
+say "Updating webpack paths to include .jsx file extension"
+insert_into_file Webpacker.config.config_path, "    - .jsx\n", after: /extensions:\n/
+
 say "Installing all react dependencies"
 run "yarn add react react-dom babel-preset-react prop-types"
 

data/lib/install/template.rb

@@ -17,25 +17,24 @@ say "Installing binstubs"
 run "bundle binstubs webpacker"
 
 say "Adding configurations"
-environment <<CONFIG, env: :development
-  # Verifies that versions and hashed value of the package contents in the project's package.json
-  config.webpacker.check_yarn_integrity = true
-CONFIG
-environment <<CONFIG, env: :production
-  # Verifies that versions and hashed value of the package contents in the project's package.json
-  config.webpacker.check_yarn_integrity = false
-CONFIG
+
+# Verifies that versions and hashed value of the package contents in the project's package.json
+inject_into_file "config/environments/development.rb", "    config.webpacker.check_yarn_integrity = true", after: "Rails.application.configure do\n", verbose: false
+inject_into_file "config/environments/production.rb", "   config.webpacker.check_yarn_integrity = false", after: "Rails.application.configure do\n", verbose: false
 
 if File.exists?(".gitignore")
   append_to_file ".gitignore", <<-EOS
 /public/packs
 /public/packs-test
 /node_modules
+yarn-debug.log*
+yarn-error.log*
+.yarn-integrity
 EOS
 end
 
 say "Installing all JavaScript dependencies"
-run "yarn add @rails/webpacker coffeescript@1.12.7"
+run "yarn add @rails/webpacker"
 
 say "Installing dev server for live reloading"
 run "yarn add --dev webpack-dev-server"

data/lib/install/typescript.rb

@@ -0,0 +1,46 @@
+require "webpacker/configuration"
+
+additional_packages = ""
+example_source = "typescript"
+
+# Additional configuration is required for React projects
+package_json = Rails.root.join("package.json")
+if File.exist?(package_json)
+  package = JSON.parse(File.read(package_json))
+  package["dependencies"] ||= {}
+
+  if package["dependencies"].keys.include?("react")
+    additional_packages = "@types/react @types/react-dom"
+    example_source = "react"
+  end
+end
+
+say "Copying typescript 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 tsconfig.json to the Rails root directory for typescript"
+copy_file "#{__dir__}/examples/#{example_source}/tsconfig.json", "tsconfig.json"
+
+say "Updating webpack paths to include .ts file extension"
+insert_into_file Webpacker.config.config_path, "    - .ts\n", after: /extensions:\n/
+
+say "Updating webpack paths to include .tsx file extension"
+insert_into_file Webpacker.config.config_path, "    - .tsx\n", after: /extensions:\n/
+
+say "Copying the example entry file to #{Webpacker.config.source_entry_path}"
+copy_file "#{__dir__}/examples/typescript/hello_typescript.ts",
+  "#{Webpacker.config.source_entry_path}/hello_typescript.ts"
+
+say "Installing all typescript dependencies"
+run "yarn add typescript ts-loader #{additional_packages}"
+
+say "Webpacker now supports typescript 🎉", :green