webpacker 3.0.2 → 3.1.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (94) hide show
  1. checksums.yaml +4 -4
  2. data/.eslintignore +1 -0
  3. data/.travis.yml +10 -0
  4. data/CHANGELOG.md +110 -0
  5. data/Gemfile.lock +69 -67
  6. data/MIT-LICENSE +1 -1
  7. data/README.md +86 -30
  8. data/docs/assets.md +4 -4
  9. data/docs/cloud9.md +310 -0
  10. data/docs/css.md +32 -3
  11. data/docs/deployment.md +42 -4
  12. data/docs/docker.md +49 -0
  13. data/docs/env.md +5 -5
  14. data/docs/folder-structure.md +2 -2
  15. data/docs/testing.md +14 -34
  16. data/docs/troubleshooting.md +40 -4
  17. data/docs/typescript.md +2 -2
  18. data/docs/webpack-dev-server.md +21 -4
  19. data/docs/webpack.md +103 -25
  20. data/gemfiles/Gemfile-rails-edge +13 -0
  21. data/gemfiles/Gemfile-rails.4.2.x +10 -0
  22. data/gemfiles/Gemfile-rails.5.0.x +10 -0
  23. data/gemfiles/Gemfile-rails.5.1.x +10 -0
  24. data/lib/install/angular.rb +5 -5
  25. data/lib/install/config/webpacker.yml +7 -0
  26. data/lib/install/elm.rb +7 -7
  27. data/lib/install/examples/vue/hello_vue.js +30 -4
  28. data/lib/install/react.rb +5 -5
  29. data/lib/install/template.rb +19 -9
  30. data/lib/install/vue.rb +4 -4
  31. data/lib/tasks/installers.rake +2 -2
  32. data/lib/tasks/webpacker.rake +7 -6
  33. data/lib/tasks/webpacker/check_binstubs.rake +3 -3
  34. data/lib/tasks/webpacker/compile.rake +15 -8
  35. data/lib/tasks/webpacker/install.rake +4 -4
  36. data/lib/tasks/webpacker/verify_install.rake +1 -1
  37. data/lib/webpacker/compiler.rb +6 -6
  38. data/lib/webpacker/dev_server.rb +2 -2
  39. data/lib/webpacker/dev_server_proxy.rb +2 -1
  40. data/lib/webpacker/dev_server_runner.rb +4 -4
  41. data/lib/webpacker/helper.rb +3 -3
  42. data/lib/webpacker/manifest.rb +2 -2
  43. data/lib/webpacker/railtie.rb +41 -2
  44. data/lib/webpacker/runner.rb +1 -1
  45. data/lib/webpacker/version.rb +1 -1
  46. data/package.json +29 -21
  47. data/package/asset_host.js +4 -5
  48. data/package/config.js +7 -1
  49. data/package/config_types/__tests__/config_list.js +123 -0
  50. data/package/config_types/__tests__/config_object.js +43 -0
  51. data/package/config_types/config_list.js +83 -0
  52. data/package/config_types/config_object.js +55 -0
  53. data/package/config_types/index.js +7 -0
  54. data/package/environment.js +64 -40
  55. data/package/environments/development.js +31 -34
  56. data/package/environments/production.js +14 -11
  57. data/package/index.js +7 -2
  58. data/package/{loaders → rules}/babel.js +6 -4
  59. data/package/{loaders → rules}/coffee.js +3 -1
  60. data/package/rules/css.js +39 -0
  61. data/package/rules/elm.js +23 -0
  62. data/package/rules/erb.js +11 -0
  63. data/package/{loaders → rules}/file.js +1 -1
  64. data/package/rules/index.js +23 -0
  65. data/package/rules/sass.js +15 -0
  66. data/package/{loaders → rules}/typescript.js +3 -1
  67. data/package/rules/url.js +13 -0
  68. data/package/rules/vue.js +13 -0
  69. data/package/utils/__tests__/deep_assign.js +11 -0
  70. data/package/utils/__tests__/deep_merge.js +10 -0
  71. data/package/utils/__tests__/objectify.js +9 -0
  72. data/package/utils/deep_assign.js +22 -0
  73. data/package/utils/deep_merge.js +23 -0
  74. data/package/utils/helpers.js +32 -0
  75. data/package/utils/objectify.js +4 -0
  76. data/test/command_test.rb +1 -1
  77. data/test/compiler_test.rb +5 -1
  78. data/test/configuration_test.rb +1 -1
  79. data/test/dev_server_test.rb +1 -1
  80. data/test/helper_test.rb +15 -10
  81. data/test/manifest_test.rb +1 -1
  82. data/test/rake_tasks_test.rb +29 -0
  83. data/test/test_app/Rakefile +3 -0
  84. data/test/test_app/config/application.rb +11 -0
  85. data/test/test_app/config/environment.rb +4 -0
  86. data/test/{webpacker_test_helper.rb → test_helper.rb} +3 -14
  87. data/webpacker.gemspec +1 -1
  88. data/yarn.lock +1552 -829
  89. metadata +43 -16
  90. data/package/loaders/elm.js +0 -19
  91. data/package/loaders/erb.js +0 -9
  92. data/package/loaders/style.js +0 -31
  93. data/package/loaders/vue.js +0 -12
  94. data/test/test_app/config/secrets.yml +0 -5
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: e29d1fa9bd905782462ea86943ac0f6c41bc610b
4
- data.tar.gz: a8d0c7cc0b52389cdf3e3d4c65bb7b6a74b75b00
3
+ metadata.gz: af4f2c2e5c0ce6a48627f89a802d979a022a9421
4
+ data.tar.gz: afccd5805bcf36333c987972ffcdcc5952fd8ef6
5
5
  SHA512:
6
- metadata.gz: 00202a0bca78706ba430c3e2475103cf78a38947d664c40ef00a64ccffbd4f7ef608d5f4dad4f1bbbcdd3a5b6f6317ce308543c41cdff9379a164a8ffd14a354
7
- data.tar.gz: 9bcd5eb3dab53f78807b811d94efa673edee119eeb72d85d1830f89794c996583a1da502e6a8b81fd83c047617089587fb227f102f7cd13a2b618cbfd031b0a5
6
+ metadata.gz: 936d628434e53e52069bad3578e333051994563ddd4872c88ac35394189640e90bf6cd7f7a0e27eb39faa4bc20e263a9dc287a6beb0a7fca9f27f09d9b3ce5d0
7
+ data.tar.gz: 1cc1a5def4986d5b6c0037883939b454e2fb53a255e5a79ac2128a4363edc48068c086e2388c901c9e9b7a731874502c0786950ee74ae43a7e0b4c607571e38d
data/.eslintignore CHANGED
@@ -1,3 +1,4 @@
1
1
  lib/*
2
2
  node_modules/*
3
3
  vendor/*
4
+ **/__tests__/**/*
data/.travis.yml CHANGED
@@ -4,6 +4,12 @@ rvm:
4
4
  - 2.2.8
5
5
  - 2.3.5
6
6
  - 2.4.2
7
+ - ruby-head
8
+ gemfile:
9
+ - gemfiles/Gemfile-rails.4.2.x
10
+ - gemfiles/Gemfile-rails.5.0.x
11
+ - gemfiles/Gemfile-rails.5.1.x
12
+ - gemfiles/Gemfile-rails-edge
7
13
  cache:
8
14
  bundler: true
9
15
  directories:
@@ -18,5 +24,9 @@ install:
18
24
  - yarn
19
25
  script:
20
26
  - yarn lint
27
+ - yarn test
21
28
  - bundle exec rubocop
22
29
  - bundle exec rake test
30
+ matrix:
31
+ allow_failures:
32
+ - gemfile: gemfiles/Gemfile-rails-edge
data/CHANGELOG.md CHANGED
@@ -1,3 +1,113 @@
1
+ ## [3.1.0] - 2017-10-04
2
+
3
+
4
+ ### Added (npm module)
5
+
6
+ - Expose base config from environment
7
+
8
+ ```js
9
+ environment.config.set('resolve.extensions', ['.foo', '.bar'])
10
+ environment.config.set('output.filename', '[name].js')
11
+ environment.config.delete('output.chunkFilename')
12
+ environment.config.get('resolve')
13
+ environment.config.merge({ output: {
14
+ filename: '[name].js'
15
+ }
16
+ })
17
+ ```
18
+
19
+ - Expose new API's for loaders and plugins to insert at position
20
+
21
+ ```js
22
+ const jsonLoader = {
23
+ test: /\.json$/,
24
+ exclude: /node_modules/,
25
+ loader: 'json-loader'
26
+ }
27
+
28
+ environment.loaders.append('json', jsonLoader)
29
+ environment.loaders.prepend('json', jsonLoader)
30
+ environment.loaders.insert('json', jsonLoader, { after: 'style' } )
31
+ environment.loaders.insert('json', jsonLoader, { before: 'babel' } )
32
+
33
+ // Update a plugin
34
+ const manifestPlugin = environment.plugins.get('Manifest')
35
+ manifestPlugin.opts.writeToFileEmit = false
36
+
37
+ // Update coffee loader to use coffeescript 2
38
+ const babelLoader = environment.loaders.get('babel')
39
+ environment.loaders.insert('coffee', {
40
+ test: /\.coffee(\.erb)?$/,
41
+ use: babelLoader.use.concat(['coffee-loader'])
42
+ }, { before: 'json' })
43
+ ```
44
+
45
+ - Expose `resolve.modules` paths like loaders and plugins
46
+
47
+ ```js
48
+ environment.resolvedModules.append('vendor', 'vendor')
49
+ ```
50
+
51
+ - Enable sourcemaps in `style` and `css` loader
52
+
53
+ - Separate `css` and `sass` loader for easier configuration. `style` loader is now
54
+ `css` loader, which resolves `.css` files and `sass` loader resolves `.scss` and `.sass`
55
+ files.
56
+
57
+ ```js
58
+ // Enable css modules with sass loader
59
+ const sassLoader = environment.loaders.get('sass')
60
+ const cssLoader = sassLoader.use.find(loader => loader.loader === 'css-loader')
61
+
62
+ cssLoader.options = Object.assign(cssLoader.options, {
63
+ modules: true,
64
+ localIdentName: '[path][name]__[local]--[hash:base64:5]'
65
+ })
66
+ ```
67
+
68
+ - Expose rest of configurable dev server options from webpacker.yml
69
+
70
+ ```yml
71
+ quiet: false
72
+ headers:
73
+ 'Access-Control-Allow-Origin': '*'
74
+ watch_options:
75
+ ignored: /node_modules/
76
+ ```
77
+
78
+ - `pretty` option to disable/enable color and progress output when running dev server
79
+
80
+ ```yml
81
+ dev_server:
82
+ pretty: false
83
+ ```
84
+
85
+ - Enforce deterministic loader order in desc order, starts processing from top to bottom
86
+
87
+ - Enforce the entire path of all required modules match the exact case of the actual path on disk using [case sensitive paths plugin](https://github.com/Urthen/case-sensitive-paths-webpack-plugin).
88
+
89
+ - Add url loader to process and embed smaller static files
90
+
91
+
92
+ ### Removed
93
+
94
+ - resolve url loader [#1042](https://github.com/rails/webpacker/issues/1042)
95
+
96
+ ### Added (Gem)
97
+
98
+ - Allow skipping webpacker compile using an env variable
99
+
100
+ ```bash
101
+ WEBPACKER_PRECOMPILE=no|false|n|f
102
+ WEBPACKER_PRECOMPILE=false bundle exec rails assets:precompile
103
+ ```
104
+
105
+ - Use `WEBPACKER_ASSET_HOST` instead of `ASSET_HOST` for CDN
106
+
107
+ - Alias `webpacker:compile` task to `assets:precompile` if is not defined so it works
108
+ without sprockets
109
+
110
+
1
111
  ## [3.0.2] - 2017-10-04
2
112
 
3
113
  ### Added
data/Gemfile.lock CHANGED
@@ -1,7 +1,7 @@
1
1
  PATH
2
2
  remote: .
3
3
  specs:
4
- webpacker (3.0.2)
4
+ webpacker (3.1.0)
5
5
  activesupport (>= 4.2)
6
6
  rack-proxy (>= 0.6.1)
7
7
  railties (>= 4.2)
@@ -9,118 +9,120 @@ PATH
9
9
  GEM
10
10
  remote: https://rubygems.org/
11
11
  specs:
12
- actioncable (5.0.1)
13
- actionpack (= 5.0.1)
14
- nio4r (~> 1.2)
12
+ actioncable (5.1.4)
13
+ actionpack (= 5.1.4)
14
+ nio4r (~> 2.0)
15
15
  websocket-driver (~> 0.6.1)
16
- actionmailer (5.0.1)
17
- actionpack (= 5.0.1)
18
- actionview (= 5.0.1)
19
- activejob (= 5.0.1)
16
+ actionmailer (5.1.4)
17
+ actionpack (= 5.1.4)
18
+ actionview (= 5.1.4)
19
+ activejob (= 5.1.4)
20
20
  mail (~> 2.5, >= 2.5.4)
21
21
  rails-dom-testing (~> 2.0)
22
- actionpack (5.0.1)
23
- actionview (= 5.0.1)
24
- activesupport (= 5.0.1)
22
+ actionpack (5.1.4)
23
+ actionview (= 5.1.4)
24
+ activesupport (= 5.1.4)
25
25
  rack (~> 2.0)
26
- rack-test (~> 0.6.3)
26
+ rack-test (>= 0.6.3)
27
27
  rails-dom-testing (~> 2.0)
28
28
  rails-html-sanitizer (~> 1.0, >= 1.0.2)
29
- actionview (5.0.1)
30
- activesupport (= 5.0.1)
29
+ actionview (5.1.4)
30
+ activesupport (= 5.1.4)
31
31
  builder (~> 3.1)
32
- erubis (~> 2.7.0)
32
+ erubi (~> 1.4)
33
33
  rails-dom-testing (~> 2.0)
34
- rails-html-sanitizer (~> 1.0, >= 1.0.2)
35
- activejob (5.0.1)
36
- activesupport (= 5.0.1)
34
+ rails-html-sanitizer (~> 1.0, >= 1.0.3)
35
+ activejob (5.1.4)
36
+ activesupport (= 5.1.4)
37
37
  globalid (>= 0.3.6)
38
- activemodel (5.0.1)
39
- activesupport (= 5.0.1)
40
- activerecord (5.0.1)
41
- activemodel (= 5.0.1)
42
- activesupport (= 5.0.1)
43
- arel (~> 7.0)
44
- activesupport (5.0.1)
38
+ activemodel (5.1.4)
39
+ activesupport (= 5.1.4)
40
+ activerecord (5.1.4)
41
+ activemodel (= 5.1.4)
42
+ activesupport (= 5.1.4)
43
+ arel (~> 8.0)
44
+ activesupport (5.1.4)
45
45
  concurrent-ruby (~> 1.0, >= 1.0.2)
46
46
  i18n (~> 0.7)
47
47
  minitest (~> 5.1)
48
48
  tzinfo (~> 1.1)
49
- arel (7.1.4)
49
+ arel (8.0.0)
50
50
  ast (2.3.0)
51
51
  builder (3.2.3)
52
- byebug (9.0.6)
52
+ byebug (9.1.0)
53
53
  concurrent-ruby (1.0.5)
54
- erubis (2.7.0)
55
- globalid (0.3.7)
56
- activesupport (>= 4.1.0)
57
- i18n (0.8.1)
58
- loofah (2.0.3)
54
+ crass (1.0.2)
55
+ erubi (1.6.1)
56
+ globalid (0.4.0)
57
+ activesupport (>= 4.2.0)
58
+ i18n (0.8.6)
59
+ loofah (2.1.1)
60
+ crass (~> 1.0.2)
59
61
  nokogiri (>= 1.5.9)
60
- mail (2.6.4)
62
+ mail (2.6.6)
61
63
  mime-types (>= 1.16, < 4)
62
- method_source (0.8.2)
64
+ method_source (0.9.0)
63
65
  mime-types (3.1)
64
66
  mime-types-data (~> 3.2015)
65
67
  mime-types-data (3.2016.0521)
66
- mini_portile2 (2.1.0)
67
- minitest (5.10.1)
68
- nio4r (1.2.1)
69
- nokogiri (1.7.0.1)
70
- mini_portile2 (~> 2.1.0)
68
+ mini_portile2 (2.3.0)
69
+ minitest (5.10.3)
70
+ nio4r (2.1.0)
71
+ nokogiri (1.8.1)
72
+ mini_portile2 (~> 2.3.0)
71
73
  parallel (1.12.0)
72
74
  parser (2.4.0.0)
73
75
  ast (~> 2.2)
74
76
  powerpack (0.1.1)
75
- rack (2.0.1)
76
- rack-proxy (0.6.1)
77
+ rack (2.0.3)
78
+ rack-proxy (0.6.2)
77
79
  rack
78
- rack-test (0.6.3)
79
- rack (>= 1.0)
80
- rails (5.0.1)
81
- actioncable (= 5.0.1)
82
- actionmailer (= 5.0.1)
83
- actionpack (= 5.0.1)
84
- actionview (= 5.0.1)
85
- activejob (= 5.0.1)
86
- activemodel (= 5.0.1)
87
- activerecord (= 5.0.1)
88
- activesupport (= 5.0.1)
89
- bundler (>= 1.3.0, < 2.0)
90
- railties (= 5.0.1)
80
+ rack-test (0.7.0)
81
+ rack (>= 1.0, < 3)
82
+ rails (5.1.4)
83
+ actioncable (= 5.1.4)
84
+ actionmailer (= 5.1.4)
85
+ actionpack (= 5.1.4)
86
+ actionview (= 5.1.4)
87
+ activejob (= 5.1.4)
88
+ activemodel (= 5.1.4)
89
+ activerecord (= 5.1.4)
90
+ activesupport (= 5.1.4)
91
+ bundler (>= 1.3.0)
92
+ railties (= 5.1.4)
91
93
  sprockets-rails (>= 2.0.0)
92
- rails-dom-testing (2.0.2)
93
- activesupport (>= 4.2.0, < 6.0)
94
- nokogiri (~> 1.6)
94
+ rails-dom-testing (2.0.3)
95
+ activesupport (>= 4.2.0)
96
+ nokogiri (>= 1.6)
95
97
  rails-html-sanitizer (1.0.3)
96
98
  loofah (~> 2.0)
97
- railties (5.0.1)
98
- actionpack (= 5.0.1)
99
- activesupport (= 5.0.1)
99
+ railties (5.1.4)
100
+ actionpack (= 5.1.4)
101
+ activesupport (= 5.1.4)
100
102
  method_source
101
103
  rake (>= 0.8.7)
102
104
  thor (>= 0.18.1, < 2.0)
103
105
  rainbow (2.2.2)
104
106
  rake
105
- rake (12.0.0)
106
- rubocop (0.49.1)
107
+ rake (12.1.0)
108
+ rubocop (0.50.0)
107
109
  parallel (~> 1.10)
108
110
  parser (>= 2.3.3.1, < 3.0)
109
111
  powerpack (~> 0.1)
110
- rainbow (>= 1.99.1, < 3.0)
112
+ rainbow (>= 2.2.2, < 3.0)
111
113
  ruby-progressbar (~> 1.7)
112
114
  unicode-display_width (~> 1.0, >= 1.0.1)
113
- ruby-progressbar (1.8.1)
115
+ ruby-progressbar (1.9.0)
114
116
  sprockets (3.7.1)
115
117
  concurrent-ruby (~> 1.0)
116
118
  rack (> 1, < 3)
117
- sprockets-rails (3.2.0)
119
+ sprockets-rails (3.2.1)
118
120
  actionpack (>= 4.0)
119
121
  activesupport (>= 4.0)
120
122
  sprockets (>= 3.0.0)
121
- thor (0.19.4)
123
+ thor (0.20.0)
122
124
  thread_safe (0.3.6)
123
- tzinfo (1.2.2)
125
+ tzinfo (1.2.3)
124
126
  thread_safe (~> 0.1)
125
127
  unicode-display_width (1.3.0)
126
128
  websocket-driver (0.6.5)
data/MIT-LICENSE CHANGED
@@ -1,4 +1,4 @@
1
- Copyright (c) 2016 David Heinemeier Hansson, Basecamp
1
+ Copyright (c) 2016-2017 David Heinemeier Hansson, Basecamp
2
2
 
3
3
  Permission is hereby granted, free of charge, to any person obtaining
4
4
  a copy of this software and associated documentation files (the
data/README.md CHANGED
@@ -5,9 +5,9 @@
5
5
  [![Gem](https://img.shields.io/gem/v/webpacker.svg)](https://github.com/rails/webpacker)
6
6
 
7
7
  Webpacker makes it easy to use the JavaScript pre-processor and bundler
8
- [Webpack 3.x.x+](https://webpack.js.org/)
8
+ [webpack 3.x.x+](https://webpack.js.org/)
9
9
  to manage application-like JavaScript in Rails. It coexists with the asset pipeline,
10
- as the primary purpose for Webpack is app-like JavaScript, not images, CSS, or
10
+ as the primary purpose for webpack is app-like JavaScript, not images, CSS, or
11
11
  even JavaScript Sprinkles (that all continues to live in app/assets).
12
12
 
13
13
  However, it is possible to use Webpacker for CSS, images and fonts assets as well,
@@ -20,10 +20,11 @@ in which case you may not even need the asset pipeline. This is mostly relevant
20
20
  - [Prerequisites](#prerequisites)
21
21
  - [Features](#features)
22
22
  - [Installation](#installation)
23
- - [Upgrading](#upgrading)
24
23
  - [Usage](#usage)
25
24
  - [Development](#development)
26
- - [Webpack configuration](#webpack-configuration)
25
+ - [webpack configuration](#webpack-configuration)
26
+ - [Upgrading](#upgrading)
27
+ - [Yarn Integrity](#yarn-integrity)
27
28
  - [Integrations](#integrations)
28
29
  - [React](#react)
29
30
  - [Angular with TypeScript](#angular-with-typescript)
@@ -49,10 +50,10 @@ in which case you may not even need the asset pipeline. This is mostly relevant
49
50
 
50
51
  ## Features
51
52
 
52
- * [Webpack 3.x.x](https://webpack.js.org/)
53
+ * [webpack 3.x.x](https://webpack.js.org/)
53
54
  * ES6 with [babel](https://babeljs.io/)
54
55
  * Automatic code splitting using multiple entry points
55
- * Stylesheets - SASS and CSS
56
+ * Stylesheets - Sass and CSS
56
57
  * Images and fonts
57
58
  * PostCSS - Auto-Prefixer
58
59
  * Asset compression, source-maps, and minification
@@ -82,7 +83,7 @@ gem 'webpacker', '~> 3.0'
82
83
  gem 'webpacker', git: 'https://github.com/rails/webpacker.git'
83
84
  ```
84
85
 
85
- and finally, run following to install webpacker:
86
+ and finally, run following to install Webpacker:
86
87
 
87
88
  ```bash
88
89
  bundle
@@ -108,7 +109,7 @@ app/javascript:
108
109
  └── logo.svg
109
110
  ```
110
111
 
111
- You can then link the javascript pack in Rails view using `javascript_pack_tag` helper.
112
+ You can then link the JavaScript pack in Rails view using `javascript_pack_tag` helper.
112
113
  If you have styles imported in your pack file, you can link using `stylesheet_pack_tag`:
113
114
 
114
115
  ```erb
@@ -159,7 +160,12 @@ Once you start this development server, Webpacker will automatically start proxy
159
160
  webpack asset requests to this server. When you stop the server, it'll revert to
160
161
  on-demand compilation again.
161
162
 
162
- You can use environment variables as options supported by [webpack-dev-server](https://webpack.js.org/configuration/dev-server/) in the form `WEBPACKER_DEV_SERVER_<OPTION>`. Please note that these environment variables will always take precedence over the ones already set in the configuration file.
163
+ You can use environment variables as options supported by
164
+ [webpack-dev-server](https://webpack.js.org/configuration/dev-server/) in the
165
+ form `WEBPACKER_DEV_SERVER_<OPTION>`. Please note that these environment
166
+ variables will always take precedence over the ones already set in the
167
+ configuration file, and that the _same_ environment variables must
168
+ be available to the `rails server` process.
163
169
 
164
170
  ```bash
165
171
  WEBPACKER_DEV_SERVER_HOST=example.com WEBPACKER_DEV_SERVER_INLINE=true WEBPACKER_DEV_SERVER_HOT=false ./bin/webpack-dev-server
@@ -173,20 +179,43 @@ you can set the `host` when running `./bin/webpack-dev-server` binstub:
173
179
  WEBPACKER_DEV_SERVER_HOST=0.0.0.0 ./bin/webpack-dev-server
174
180
  ```
175
181
 
182
+ **Note:** You need to allow webpack-dev-server host as allowed origin for `connect-src` if you are running your application in a restrict CSP environment like Rails 5.2+. This can be done in Rails 5.2+ for development environment in the CSP initializer `config/initializers/content_security_policy.rb` with a snippet like this:
183
+
184
+ ```ruby
185
+ p.connect_src :self, :https, 'http://localhost:3035', 'ws://localhost:3035' if Rails.env.development?
186
+ ```
187
+
176
188
  **Note:** Don't forget to prefix `ruby` when running these binstubs on windows
177
189
 
178
- ### Webpack configuration
190
+ ### webpack configuration
179
191
 
180
- See [docs/Webpack](docs/webpack.md) for modifying webpack configuration and loaders.
192
+ See [docs/webpack](docs/webpack.md) for modifying webpack configuration and loaders.
181
193
 
182
194
 
183
195
  ### Upgrading
184
196
 
185
- You can run following commands to upgrade webpacker to the latest stable version, this involves upgrading the gem and npm module:
197
+ You can run following commands to upgrade Webpacker to the latest stable version, this involves upgrading the gem and related npm modules:
186
198
 
187
199
  ```bash
188
200
  bundle update webpacker
189
201
  yarn upgrade @rails/webpacker --latest
202
+ yarn upgrade webpack-dev-server --latest
203
+ ```
204
+
205
+ ### Yarn Integrity
206
+
207
+ By default in development, webpacker runs a yarn integrity check to ensure that all local npm packages are up-to-date. This is similar to what bundler does currently in Rails, but for JavaScript packages. If your system is out of date, then Rails will not initialize and you will be asked to upgrade your local npm packages by running `yarn install`.
208
+
209
+ To turn off this option, you will need to override the default by adding a new config options to your Rails development environment configuration file (`config/environment/development.rb`):
210
+
211
+ ```
212
+ config.webpacker.check_yarn_integrity = false
213
+ ```
214
+
215
+ You may also turn on this option by adding the config option to any Rails environment configuration file:
216
+
217
+ ```
218
+ config.webpacker.check_yarn_integrity = true
190
219
  ```
191
220
 
192
221
  ## Integrations
@@ -205,9 +234,9 @@ rails new myapp --webpack=react
205
234
  ```
206
235
 
207
236
  (or run `bundle exec rails webpacker:install:react` in a existing Rails app already
208
- setup with webpacker).
237
+ setup with Webpacker).
209
238
 
210
- The installer will add all relevant dependencies using yarn, any changes
239
+ The installer will add all relevant dependencies using Yarn, any changes
211
240
  to the configuration files and an example React component to your
212
241
  project in `app/javascript/packs` so that you can experiment with React right away.
213
242
 
@@ -223,13 +252,30 @@ rails new myapp --webpack=angular
223
252
  ```
224
253
 
225
254
  (or run `bundle exec rails webpacker:install:angular` on a Rails app already
226
- setup with webpacker).
255
+ setup with Webpacker).
227
256
 
228
- The installer will add TypeScript and Angular core libraries using yarn plus
257
+ The installer will add TypeScript and Angular core libraries using Yarn plus
229
258
  any changes to the configuration files. An example component is written in
230
259
  TypeScript will also be added to your project in `app/javascript` so that
231
260
  you can experiment with Angular right away.
232
261
 
262
+ By default Angular uses a JIT compiler for development environment, this
263
+ compiler is not compatible with restrictive CSP (Content Security
264
+ Policy) environments like Rails 5.2+. You can use Angular AOT compiler
265
+ in development with the [@ngtools/webpack](https://www.npmjs.com/package/@ngtools/webpack#usage) plugin.
266
+
267
+ Alternatively if you're using Rails 5.2+ you can enable `unsafe-eval` rule for
268
+ development environment, this can be done in the `config/initializers/content_security_policy.rb`
269
+ with the following configuration:
270
+
271
+ ```ruby
272
+ if Rails.env.development?
273
+ p.script_src :self, :https, :unsafe_eval
274
+ else
275
+ p.script_src :self, :https
276
+ end
277
+ ```
278
+
233
279
 
234
280
  ### Vue
235
281
 
@@ -240,13 +286,26 @@ new Rails 5.1+ app using `--webpack=vue` option:
240
286
  # Rails 5.1+
241
287
  rails new myapp --webpack=vue
242
288
  ```
243
- (or run `bundle exec rails webpacker:install:vue` on a Rails app already setup with webpacker).
289
+ (or run `bundle exec rails webpacker:install:vue` on a Rails app already setup with Webpacker).
244
290
 
245
- The installer will add Vue and required libraries using yarn plus
291
+ The installer will add Vue and required libraries using Yarn plus
246
292
  any changes to the configuration files. An example component will
247
293
  also be added to your project in `app/javascript` so that you can
248
294
  experiment Vue right away.
249
295
 
296
+ If you're using Rails 5.2+ you need to enable `unsafe-eval` rule for development environment,
297
+ this can be done in the `config/initializers/content_security_policy.rb` with the following
298
+ configuration:
299
+
300
+ ```ruby
301
+ if Rails.env.development?
302
+ p.script_src :self, :https, :unsafe_eval
303
+ else
304
+ p.script_src :self, :https
305
+ end
306
+ ```
307
+ You can read more this in [Vue docs](https://vuejs.org/v2/guide/installation.html#CSP-environments).
308
+
250
309
 
251
310
  ### Elm
252
311
 
@@ -258,7 +317,7 @@ new Rails 5.1+ app using `--webpack=elm` option:
258
317
  rails new myapp --webpack=elm
259
318
  ```
260
319
 
261
- (or run `bundle exec rails webpacker:install:elm` on a Rails app already setup with webpacker).
320
+ (or run `bundle exec rails webpacker:install:elm` on a Rails app already setup with Webpacker).
262
321
 
263
322
  The Elm library and core packages will be added via Yarn and Elm itself.
264
323
  An example `Main.elm` app will also be added to your project in `app/javascript`
@@ -267,15 +326,15 @@ so that you can experiment with Elm right away.
267
326
 
268
327
  ## Paths
269
328
 
270
- By default, webpacker ships with simple conventions for where the javascript
271
- app files and compiled webpack bundles will go in your rails app,
329
+ By default, Webpacker ships with simple conventions for where the JavaScript
330
+ app files and compiled webpack bundles will go in your Rails app,
272
331
  but all these options are configurable from `config/webpacker.yml` file.
273
332
 
274
- The configuration for what Webpack is supposed to compile by default rests
333
+ The configuration for what webpack is supposed to compile by default rests
275
334
  on the convention that every file in `app/javascript/packs/*`**(default)**
276
335
  or whatever path you set for `source_entry_path` in the `webpacker.yml` configuration
277
- is turned into their own output files (or entry points, as Webpack calls it). Therefore you don't want to put anything inside `packs` directory that you do want to be
278
- an entry file. As a rule thumb, put all files your want to link in your views inside
336
+ is turned into their own output files (or entry points, as webpack calls it). Therefore you don't want to put anything inside `packs` directory that you do not want to be
337
+ an entry file. As a rule of thumb, put all files you want to link in your views inside
279
338
  "packs" directory and keep everything else under `app/javascript`.
280
339
 
281
340
  Suppose you want to change the source directory from `app/javascript`
@@ -303,7 +362,7 @@ If you have `hmr` turned to true, then the `stylesheet_pack_tag` generates no ou
303
362
 
304
363
  ### Resolved
305
364
 
306
- If you are adding webpacker to an existing app that has most of the assets inside
365
+ If you are adding Webpacker to an existing app that has most of the assets inside
307
366
  `app/assets` or inside an engine and you want to share that
308
367
  with webpack modules then you can use `resolved_paths`
309
368
  option available in `config/webpacker.yml`, which lets you
@@ -330,7 +389,7 @@ whole parent directory if you just need to reference one or two modules
330
389
 
331
390
  By default, the lazy compilation is cached until a file is changed under
332
391
  tracked paths. You can configure the paths tracked
333
- by adding new paths to `watched_paths` array, much like rails `autoload_paths`:
392
+ by adding new paths to `watched_paths` array, much like Rails `autoload_paths`:
334
393
 
335
394
  ```rb
336
395
  # config/initializers/webpacker.rb
@@ -341,10 +400,7 @@ Webpacker::Compiler.watched_paths << 'bower_components'
341
400
 
342
401
  ## Deployment
343
402
 
344
- 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
345
- can manually trigger `NODE_ENV=production bundle exec rails webpacker:compile`
346
- during your app deploy.
347
-
403
+ 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.
348
404
 
349
405
  ## Docs
350
406