webpacker 6.0.0.pre.2 → 6.0.0.rc.4
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/.github/workflows/jest.yml +5 -2
- data/.github/workflows/js-lint.yml +5 -2
- data/.github/workflows/rubocop.yml +1 -1
- data/.github/workflows/ruby.yml +17 -14
- data/.node-version +1 -1
- data/.rubocop.yml +106 -0
- data/CHANGELOG.md +36 -9
- data/CONTRIBUTING.md +1 -1
- data/Gemfile.lock +107 -104
- data/README.md +370 -169
- data/config/README.md +3 -0
- data/config/webpacker.yml +1 -0
- data/docs/deployment.md +9 -29
- data/docs/developing_webpacker.md +29 -0
- data/docs/troubleshooting.md +57 -25
- data/docs/v6_upgrade.md +75 -0
- data/gemfiles/Gemfile-rails-edge +1 -1
- data/gemfiles/Gemfile-rails.6.1.x +12 -0
- data/lib/install/bin/yarn +18 -0
- data/lib/install/config/webpacker.yml +17 -18
- data/lib/install/package.json +17 -0
- data/lib/install/{javascript/packs → packs/entrypoints}/application.js +4 -3
- data/lib/install/template.rb +41 -21
- data/lib/tasks/webpacker/binstubs.rake +2 -2
- data/lib/tasks/webpacker/check_node.rake +3 -0
- data/lib/tasks/webpacker/check_yarn.rake +4 -1
- data/lib/tasks/webpacker/clobber.rake +1 -1
- data/lib/tasks/webpacker/install.rake +2 -2
- data/lib/tasks/webpacker/verify_config.rake +14 -0
- data/lib/tasks/webpacker/verify_install.rake +1 -11
- data/lib/tasks/yarn.rake +36 -0
- data/lib/webpacker/commands.rb +21 -16
- data/lib/webpacker/compiler.rb +9 -3
- data/lib/webpacker/configuration.rb +19 -8
- data/lib/webpacker/dev_server.rb +6 -0
- data/lib/webpacker/dev_server_runner.rb +7 -2
- data/lib/webpacker/env.rb +5 -1
- data/lib/webpacker/helper.rb +26 -50
- data/lib/webpacker/instance.rb +4 -0
- data/lib/webpacker/manifest.rb +1 -2
- data/lib/webpacker/railtie.rb +1 -2
- data/lib/webpacker/runner.rb +1 -1
- data/lib/webpacker/version.rb +1 -1
- data/lib/webpacker/webpack_runner.rb +1 -0
- data/lib/webpacker.rb +1 -1
- data/package/__tests__/development.js +3 -2
- data/package/__tests__/env.js +8 -4
- data/package/__tests__/index.js +9 -0
- data/package/babel/preset.js +24 -14
- data/package/config.js +3 -3
- data/package/env.js +9 -3
- data/package/environments/__tests__/base.js +7 -7
- data/package/environments/base.js +25 -25
- data/package/environments/development.js +37 -32
- data/package/environments/production.js +28 -30
- data/package/index.js +9 -2
- data/package/inliningCss.js +7 -0
- data/package/rules/babel.js +1 -1
- data/package/rules/coffee.js +5 -5
- data/package/rules/erb.js +5 -3
- data/package/rules/file.js +5 -3
- data/package/rules/index.js +9 -17
- data/package/rules/less.js +14 -10
- data/package/rules/raw.js +5 -0
- data/package/rules/sass.js +12 -9
- data/package/rules/stylus.js +26 -0
- data/package/utils/get_style_rule.js +28 -30
- data/package/utils/helpers.js +25 -0
- data/package.json +25 -29
- data/test/command_test.rb +76 -0
- data/test/configuration_test.rb +3 -3
- data/test/dev_server_runner_test.rb +13 -2
- data/test/helper_test.rb +69 -61
- data/test/manifest_test.rb +16 -0
- data/test/mounted_app/test/dummy/config/webpacker.yml +4 -4
- data/test/test_app/app/{javascript/packs → packs/entrypoints}/application.js +1 -1
- data/test/test_app/app/{javascript/packs → packs/entrypoints}/multi_entry.css +0 -0
- data/test/test_app/app/{javascript/packs → packs/entrypoints}/multi_entry.js +0 -0
- data/test/test_app/config/webpacker.yml +4 -6
- data/test/test_app/config/webpacker_other_location.yml +79 -0
- data/test/test_app/public/packs/manifest.json +19 -5
- data/test/webpacker_test.rb +17 -0
- data/webpacker.gemspec +1 -1
- data/yarn.lock +2202 -2680
- metadata +31 -40
- data/docs/assets.md +0 -135
- data/docs/cloud9.md +0 -310
- data/docs/css.md +0 -303
- data/docs/docker.md +0 -68
- data/docs/engines.md +0 -213
- data/docs/env.md +0 -68
- data/docs/es6.md +0 -72
- data/docs/folder-structure.md +0 -66
- data/docs/integrations.md +0 -220
- data/docs/misc.md +0 -23
- data/docs/props.md +0 -187
- data/docs/react.md +0 -183
- data/docs/target.md +0 -22
- data/docs/testing.md +0 -147
- data/docs/typescript.md +0 -190
- data/docs/v4-upgrade.md +0 -142
- data/docs/webpack-dev-server.md +0 -94
- data/docs/webpack.md +0 -315
- data/docs/yarn.md +0 -23
- data/lib/install/examples/vue3/app.vue +0 -27
- data/lib/install/examples/vue3/hello_vue.js +0 -15
- data/lib/install/javascript/packs/application.css +0 -9
- data/package/babel/preset-react.js +0 -62
- data/package/rules/svg.js +0 -23
data/lib/webpacker/env.rb
CHANGED
@@ -27,7 +27,11 @@ class Webpacker::Env
|
|
27
27
|
|
28
28
|
def available_environments
|
29
29
|
if config_path.exist?
|
30
|
-
|
30
|
+
begin
|
31
|
+
YAML.load_file(config_path.to_s, aliases: true)
|
32
|
+
rescue ArgumentError
|
33
|
+
YAML.load_file(config_path.to_s)
|
34
|
+
end
|
31
35
|
else
|
32
36
|
[].freeze
|
33
37
|
end
|
data/lib/webpacker/helper.rb
CHANGED
@@ -72,43 +72,31 @@ module Webpacker::Helper
|
|
72
72
|
favicon_link_tag(resolve_path_to_image(name), options)
|
73
73
|
end
|
74
74
|
|
75
|
-
# Creates a script tag that references the named pack file, as compiled by webpack per the entries list
|
76
|
-
# in package/environments/base.js. By default, this list is auto-generated to match everything in
|
77
|
-
# app/javascript/packs/*.js. In production mode, the digested reference is automatically looked up.
|
78
|
-
#
|
79
|
-
# Example:
|
80
|
-
#
|
81
|
-
# <%= javascript_pack_tag 'calendar', 'data-turbolinks-track': 'reload' %> # =>
|
82
|
-
# <script src="/packs/calendar-1016838bab065ae1e314.js" data-turbolinks-track="reload"></script>
|
83
|
-
def javascript_pack_tag(*names, **options)
|
84
|
-
javascript_include_tag(*sources_from_manifest_entries(names, type: :javascript), **options)
|
85
|
-
end
|
86
|
-
|
87
75
|
# Creates script tags that reference the js chunks from entrypoints when using split chunks API,
|
88
76
|
# as compiled by webpack per the entries list in package/environments/base.js.
|
89
77
|
# By default, this list is auto-generated to match everything in
|
90
|
-
# app/
|
78
|
+
# app/packs/entrypoints/*.js and all the dependent chunks. In production mode, the digested reference is automatically looked up.
|
91
79
|
# See: https://webpack.js.org/plugins/split-chunks-plugin/
|
92
80
|
#
|
93
81
|
# Example:
|
94
82
|
#
|
95
|
-
# <%=
|
96
|
-
# <script src="/packs/vendor-16838bab065ae1e314.chunk.js" data-turbolinks-track="reload"></script>
|
97
|
-
# <script src="/packs/calendar~runtime-16838bab065ae1e314.chunk.js" data-turbolinks-track="reload"></script>
|
98
|
-
# <script src="/packs/calendar-1016838bab065ae1e314.chunk.js" data-turbolinks-track="reload"></script>
|
99
|
-
# <script src="/packs/map~runtime-16838bab065ae1e314.chunk.js" data-turbolinks-track="reload"></script>
|
100
|
-
# <script src="/packs/map-16838bab065ae1e314.chunk.js" data-turbolinks-track="reload"></script>
|
83
|
+
# <%= javascript_pack_tag 'calendar', 'map', 'data-turbolinks-track': 'reload' %> # =>
|
84
|
+
# <script src="/packs/vendor-16838bab065ae1e314.chunk.js" data-turbolinks-track="reload" defer="true"></script>
|
85
|
+
# <script src="/packs/calendar~runtime-16838bab065ae1e314.chunk.js" data-turbolinks-track="reload" defer="true"></script>
|
86
|
+
# <script src="/packs/calendar-1016838bab065ae1e314.chunk.js" data-turbolinks-track="reload" defer="true"></script>
|
87
|
+
# <script src="/packs/map~runtime-16838bab065ae1e314.chunk.js" data-turbolinks-track="reload" defer="true"></script>
|
88
|
+
# <script src="/packs/map-16838bab065ae1e314.chunk.js" data-turbolinks-track="reload" defer="true"></script>
|
101
89
|
#
|
102
90
|
# DO:
|
103
91
|
#
|
104
|
-
# <%=
|
92
|
+
# <%= javascript_pack_tag 'calendar', 'map' %>
|
105
93
|
#
|
106
94
|
# DON'T:
|
107
95
|
#
|
108
|
-
# <%=
|
109
|
-
# <%=
|
110
|
-
def
|
111
|
-
javascript_include_tag(*sources_from_manifest_entrypoints(names, type: :javascript), **options)
|
96
|
+
# <%= javascript_pack_tag 'calendar' %>
|
97
|
+
# <%= javascript_pack_tag 'map' %>
|
98
|
+
def javascript_pack_tag(*names, defer: true, **options)
|
99
|
+
javascript_include_tag(*sources_from_manifest_entrypoints(names, type: :javascript), **options.tap { |o| o[:defer] = defer })
|
112
100
|
end
|
113
101
|
|
114
102
|
# Creates a link tag, for preloading, that references a given Webpacker asset.
|
@@ -127,57 +115,45 @@ module Webpacker::Helper
|
|
127
115
|
end
|
128
116
|
end
|
129
117
|
|
130
|
-
# Creates a link tag that references the named pack file, as compiled by webpack per the entries list
|
131
|
-
# in package/environments/base.js. By default, this list is auto-generated to match everything in
|
132
|
-
# app/javascript/packs/*.js. In production mode, the digested reference is automatically looked up.
|
133
|
-
#
|
134
|
-
# Note: If the development server is running and hot module replacement is active, this will return nothing.
|
135
|
-
# In that setup you need to configure your styles to be inlined in your JavaScript for hot reloading.
|
136
|
-
#
|
137
|
-
# Examples:
|
138
|
-
#
|
139
|
-
# <%= stylesheet_pack_tag 'calendar', 'data-turbolinks-track': 'reload' %> # =>
|
140
|
-
# <link rel="stylesheet" media="screen" href="/packs/calendar-1016838bab065ae1e122.css" data-turbolinks-track="reload" />
|
141
|
-
def stylesheet_pack_tag(*names, **options)
|
142
|
-
stylesheet_link_tag(*sources_from_manifest_entries(names, type: :stylesheet), **options)
|
143
|
-
end
|
144
|
-
|
145
118
|
# Creates link tags that reference the css chunks from entrypoints when using split chunks API,
|
146
119
|
# as compiled by webpack per the entries list in package/environments/base.js.
|
147
120
|
# By default, this list is auto-generated to match everything in
|
148
|
-
# app/
|
121
|
+
# app/packs/entrypoints/*.js and all the dependent chunks. In production mode, the digested reference is automatically looked up.
|
149
122
|
# See: https://webpack.js.org/plugins/split-chunks-plugin/
|
150
123
|
#
|
151
124
|
# Examples:
|
152
125
|
#
|
153
|
-
# <%=
|
126
|
+
# <%= stylesheet_pack_tag 'calendar', 'map' %> # =>
|
154
127
|
# <link rel="stylesheet" media="screen" href="/packs/3-8c7ce31a.chunk.css" />
|
155
128
|
# <link rel="stylesheet" media="screen" href="/packs/calendar-8c7ce31a.chunk.css" />
|
156
129
|
# <link rel="stylesheet" media="screen" href="/packs/map-8c7ce31a.chunk.css" />
|
157
130
|
#
|
131
|
+
# When using the webpack-dev-server, CSS is inlined so HMR can be turned on for CSS,
|
132
|
+
# including CSS modules
|
133
|
+
# <%= stylesheet_pack_tag 'calendar', 'map' %> # => nil
|
134
|
+
#
|
158
135
|
# DO:
|
159
136
|
#
|
160
|
-
# <%=
|
137
|
+
# <%= stylesheet_pack_tag 'calendar', 'map' %>
|
161
138
|
#
|
162
139
|
# DON'T:
|
163
140
|
#
|
164
|
-
# <%=
|
165
|
-
# <%=
|
166
|
-
def
|
141
|
+
# <%= stylesheet_pack_tag 'calendar' %>
|
142
|
+
# <%= stylesheet_pack_tag 'map' %>
|
143
|
+
def stylesheet_pack_tag(*names, **options)
|
144
|
+
return "" if Webpacker.inlining_css?
|
145
|
+
|
167
146
|
stylesheet_link_tag(*sources_from_manifest_entrypoints(names, type: :stylesheet), **options)
|
168
147
|
end
|
169
148
|
|
170
149
|
private
|
171
|
-
def sources_from_manifest_entries(names, type:)
|
172
|
-
names.map { |name| current_webpacker_instance.manifest.lookup!(name, type: type) }.flatten
|
173
|
-
end
|
174
150
|
|
175
151
|
def sources_from_manifest_entrypoints(names, type:)
|
176
|
-
names.map { |name| current_webpacker_instance.manifest.lookup_pack_with_chunks!(name, type: type) }.flatten.uniq
|
152
|
+
names.map { |name| current_webpacker_instance.manifest.lookup_pack_with_chunks!(name.to_s, type: type) }.flatten.uniq
|
177
153
|
end
|
178
154
|
|
179
155
|
def resolve_path_to_image(name, **options)
|
180
|
-
path = name.starts_with?("
|
156
|
+
path = name.starts_with?("static/") ? name : "static/#{name}"
|
181
157
|
path_to_asset(current_webpacker_instance.manifest.lookup!(path), options)
|
182
158
|
rescue
|
183
159
|
path_to_asset(current_webpacker_instance.manifest.lookup!(name), options)
|
data/lib/webpacker/instance.rb
CHANGED
data/lib/webpacker/manifest.rb
CHANGED
@@ -91,8 +91,7 @@ class Webpacker::Manifest
|
|
91
91
|
# manifest hash the entrypoints are defined by their pack name without the extension.
|
92
92
|
# When the user provides a name with a file extension, we want to try to strip it off.
|
93
93
|
def manifest_name(name, pack_type)
|
94
|
-
|
95
|
-
File.basename(name, pack_type)
|
94
|
+
name.chomp(".#{pack_type}")
|
96
95
|
end
|
97
96
|
|
98
97
|
def manifest_type(pack_type)
|
data/lib/webpacker/railtie.rb
CHANGED
@@ -8,8 +8,7 @@ class Webpacker::Engine < ::Rails::Engine
|
|
8
8
|
config.webpacker = ActiveSupport::OrderedOptions.new
|
9
9
|
|
10
10
|
initializer "webpacker.proxy" do |app|
|
11
|
-
|
12
|
-
if insert_middleware
|
11
|
+
if (Webpacker.config.dev_server.present? rescue nil)
|
13
12
|
app.middleware.insert_before 0,
|
14
13
|
Rails::VERSION::MAJOR >= 5 ?
|
15
14
|
Webpacker::DevServerProxy : "Webpacker::DevServerProxy", ssl_verify_none: true
|
data/lib/webpacker/runner.rb
CHANGED
@@ -12,7 +12,7 @@ module Webpacker
|
|
12
12
|
@app_path = File.expand_path(".", Dir.pwd)
|
13
13
|
@node_modules_bin_path = ENV["WEBPACKER_NODE_MODULES_BIN_PATH"] || `yarn bin`.chomp
|
14
14
|
@webpack_config = File.join(@app_path, "config/webpack/#{ENV["NODE_ENV"]}.js")
|
15
|
-
@webpacker_config = File.join(@app_path, "config/webpacker.yml")
|
15
|
+
@webpacker_config = ENV["WEBPACKER_CONFIG"] || File.join(@app_path, "config/webpacker.yml")
|
16
16
|
|
17
17
|
unless File.exist?(@webpack_config)
|
18
18
|
$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."
|
data/lib/webpacker/version.rb
CHANGED
data/lib/webpacker.rb
CHANGED
@@ -30,7 +30,7 @@ module Webpacker
|
|
30
30
|
Webpacker.logger = old_logger
|
31
31
|
end
|
32
32
|
|
33
|
-
delegate :logger, :logger=, :env, to: :instance
|
33
|
+
delegate :logger, :logger=, :env, :inlining_css?, to: :instance
|
34
34
|
delegate :config, :compiler, :manifest, :commands, :dev_server, to: :instance
|
35
35
|
delegate :bootstrap, :clean, :clobber, :compile, to: :commands
|
36
36
|
end
|
@@ -14,7 +14,7 @@ describe('Development environment', () => {
|
|
14
14
|
test('should use development config and environment including devServer if WEBPACK_DEV_SERVER', () => {
|
15
15
|
process.env.RAILS_ENV = 'development'
|
16
16
|
process.env.NODE_ENV = 'development'
|
17
|
-
process.env.WEBPACK_DEV_SERVER = '
|
17
|
+
process.env.WEBPACK_DEV_SERVER = 'true'
|
18
18
|
const { webpackConfig } = require('../index')
|
19
19
|
|
20
20
|
expect(webpackConfig.output.path).toEqual(resolve('public', 'packs'))
|
@@ -22,7 +22,8 @@ describe('Development environment', () => {
|
|
22
22
|
expect(webpackConfig).toMatchObject({
|
23
23
|
devServer: {
|
24
24
|
host: 'localhost',
|
25
|
-
port: 3035
|
25
|
+
port: 3035,
|
26
|
+
hot: false
|
26
27
|
}
|
27
28
|
})
|
28
29
|
})
|
data/package/__tests__/env.js
CHANGED
@@ -15,7 +15,8 @@ describe('Env', () => {
|
|
15
15
|
railsEnv: 'development',
|
16
16
|
nodeEnv: 'development',
|
17
17
|
isProduction: false,
|
18
|
-
isDevelopment: true
|
18
|
+
isDevelopment: true,
|
19
|
+
runningWebpackDevServer: false
|
19
20
|
})
|
20
21
|
})
|
21
22
|
|
@@ -26,7 +27,8 @@ describe('Env', () => {
|
|
26
27
|
railsEnv: 'development',
|
27
28
|
nodeEnv: 'production',
|
28
29
|
isProduction: true,
|
29
|
-
isDevelopment: false
|
30
|
+
isDevelopment: false,
|
31
|
+
runningWebpackDevServer: false
|
30
32
|
})
|
31
33
|
})
|
32
34
|
|
@@ -37,7 +39,8 @@ describe('Env', () => {
|
|
37
39
|
railsEnv: 'production',
|
38
40
|
nodeEnv: 'production',
|
39
41
|
isProduction: true,
|
40
|
-
isDevelopment: false
|
42
|
+
isDevelopment: false,
|
43
|
+
runningWebpackDevServer: false
|
41
44
|
})
|
42
45
|
})
|
43
46
|
|
@@ -48,7 +51,8 @@ describe('Env', () => {
|
|
48
51
|
railsEnv: 'staging',
|
49
52
|
nodeEnv: 'production',
|
50
53
|
isProduction: true,
|
51
|
-
isDevelopment: false
|
54
|
+
isDevelopment: false,
|
55
|
+
runningWebpackDevServer: false
|
52
56
|
})
|
53
57
|
})
|
54
58
|
})
|
@@ -0,0 +1,9 @@
|
|
1
|
+
const index = require('../index')
|
2
|
+
|
3
|
+
describe('index', () => {
|
4
|
+
test('exports webpack-merge v5 functions', () => {
|
5
|
+
expect(index.merge).toBeInstanceOf(Function)
|
6
|
+
expect(index.mergeWithRules).toBeInstanceOf(Function)
|
7
|
+
expect(index.mergeWithCustomize).toBeInstanceOf(Function)
|
8
|
+
})
|
9
|
+
})
|
data/package/babel/preset.js
CHANGED
@@ -1,3 +1,5 @@
|
|
1
|
+
const { moduleExists } = require('@rails/webpacker')
|
2
|
+
|
1
3
|
module.exports = function config(api) {
|
2
4
|
const validEnv = ['development', 'test', 'production']
|
3
5
|
const currentEnv = api.env()
|
@@ -7,16 +9,15 @@ module.exports = function config(api) {
|
|
7
9
|
|
8
10
|
if (!validEnv.includes(currentEnv)) {
|
9
11
|
throw new Error(
|
10
|
-
`Please specify a valid NODE_ENV or BABEL_ENV environment variable. Valid values are "development", "test", and "production". Instead, received: "${JSON.stringify(
|
12
|
+
`Please specify a valid NODE_ENV or BABEL_ENV environment variable. Valid values are "development", "test", and "production". Instead, received: "${JSON.stringify(
|
13
|
+
currentEnv
|
14
|
+
)}".`
|
11
15
|
)
|
12
16
|
}
|
13
17
|
|
14
18
|
return {
|
15
19
|
presets: [
|
16
|
-
isTestEnv && [
|
17
|
-
'@babel/preset-env',
|
18
|
-
{ targets: { node: 'current' } }
|
19
|
-
],
|
20
|
+
isTestEnv && ['@babel/preset-env', { targets: { node: 'current' } }],
|
20
21
|
(isProductionEnv || isDevelopmentEnv) && [
|
21
22
|
'@babel/preset-env',
|
22
23
|
{
|
@@ -27,18 +28,27 @@ module.exports = function config(api) {
|
|
27
28
|
loose: true,
|
28
29
|
exclude: ['transform-typeof-symbol']
|
29
30
|
}
|
31
|
+
],
|
32
|
+
moduleExists('@babel/preset-typescript') && [
|
33
|
+
'@babel/preset-typescript',
|
34
|
+
{ allExtensions: true, isTSX: true }
|
35
|
+
],
|
36
|
+
moduleExists('@babel/preset-react') && [
|
37
|
+
'@babel/preset-react',
|
38
|
+
{
|
39
|
+
development: isDevelopmentEnv || isTestEnv,
|
40
|
+
useBuiltIns: true
|
41
|
+
}
|
30
42
|
]
|
31
43
|
].filter(Boolean),
|
32
44
|
plugins: [
|
33
|
-
'babel
|
34
|
-
[
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
{ helpers: false }
|
41
|
-
]
|
45
|
+
['@babel/plugin-proposal-class-properties', { loose: true }],
|
46
|
+
['@babel/plugin-transform-runtime', { helpers: false }],
|
47
|
+
isProductionEnv &&
|
48
|
+
moduleExists('babel-plugin-transform-react-remove-prop-types') && [
|
49
|
+
'babel-plugin-transform-react-remove-prop-types',
|
50
|
+
{ removeImport: true }
|
51
|
+
]
|
42
52
|
].filter(Boolean)
|
43
53
|
}
|
44
54
|
}
|
data/package/config.js
CHANGED
@@ -1,5 +1,5 @@
|
|
1
1
|
const { resolve } = require('path')
|
2
|
-
const {
|
2
|
+
const { load } = require('js-yaml')
|
3
3
|
const { readFileSync } = require('fs')
|
4
4
|
const { merge } = require('webpack-merge')
|
5
5
|
const { ensureTrailingSlash } = require('./utils/helpers')
|
@@ -9,12 +9,12 @@ const configPath = require('./configPath')
|
|
9
9
|
const defaultConfigPath = require.resolve('../lib/install/config/webpacker.yml')
|
10
10
|
|
11
11
|
const getDefaultConfig = () => {
|
12
|
-
const defaultConfig =
|
12
|
+
const defaultConfig = load(readFileSync(defaultConfigPath), 'utf8')
|
13
13
|
return defaultConfig[railsEnv] || defaultConfig.production
|
14
14
|
}
|
15
15
|
|
16
16
|
const defaults = getDefaultConfig()
|
17
|
-
const app =
|
17
|
+
const app = load(readFileSync(configPath), 'utf8')[railsEnv]
|
18
18
|
|
19
19
|
const config = merge(defaults, app)
|
20
20
|
config.outputPath = resolve(config.public_root_path, config.public_output_path)
|
data/package/env.js
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
const {
|
1
|
+
const { load } = require('js-yaml')
|
2
2
|
const { readFileSync } = require('fs')
|
3
3
|
|
4
4
|
const NODE_ENVIRONMENTS = ['development', 'production', 'test']
|
@@ -12,13 +12,19 @@ const nodeEnv
|
|
12
12
|
const isProduction = nodeEnv === 'production'
|
13
13
|
const isDevelopment = nodeEnv === 'development'
|
14
14
|
|
15
|
-
const config =
|
15
|
+
const config = load(readFileSync(configPath), 'utf8')
|
16
16
|
const availableEnvironments = Object.keys(config).join('|')
|
17
17
|
const regex = new RegExp(`^(${availableEnvironments})$`, 'g')
|
18
18
|
|
19
|
+
// v4 of webpack-dev-server will switch to WEBPACK_DEV_SERVE
|
20
|
+
// https://github.com/rails/webpacker/issues/3057
|
21
|
+
const runningWebpackDevServer = process.env.WEBPACK_DEV_SERVER === 'true' ||
|
22
|
+
process.env.WEBPACK_DEV_SERVE === 'true'
|
23
|
+
|
19
24
|
module.exports = {
|
20
25
|
railsEnv: railsEnv && railsEnv.match(regex) ? railsEnv : DEFAULT,
|
21
26
|
nodeEnv,
|
22
27
|
isProduction,
|
23
|
-
isDevelopment
|
28
|
+
isDevelopment,
|
29
|
+
runningWebpackDevServer
|
24
30
|
}
|
@@ -17,21 +17,21 @@ describe('Base config', () => {
|
|
17
17
|
describe('config', () => {
|
18
18
|
test('should return entry', () => {
|
19
19
|
expect(baseConfig.entry.application).toEqual(
|
20
|
-
resolve('app', '
|
20
|
+
resolve('app', 'packs', 'entrypoints', 'application.js')
|
21
21
|
)
|
22
22
|
})
|
23
23
|
|
24
24
|
test('should return multi file entry points', () => {
|
25
25
|
expect(baseConfig.entry.multi_entry.sort()).toEqual([
|
26
|
-
resolve('app', '
|
27
|
-
resolve('app', '
|
26
|
+
resolve('app', 'packs', 'entrypoints', 'multi_entry.css'),
|
27
|
+
resolve('app', 'packs', 'entrypoints', 'multi_entry.js')
|
28
28
|
])
|
29
29
|
})
|
30
30
|
|
31
31
|
test('should return output', () => {
|
32
|
-
expect(baseConfig.output.filename).toEqual('js/[name]
|
32
|
+
expect(baseConfig.output.filename).toEqual('js/[name].js')
|
33
33
|
expect(baseConfig.output.chunkFilename).toEqual(
|
34
|
-
'js/[name]
|
34
|
+
'js/[name].chunk.js'
|
35
35
|
)
|
36
36
|
})
|
37
37
|
|
@@ -44,7 +44,7 @@ describe('Base config', () => {
|
|
44
44
|
})
|
45
45
|
|
46
46
|
test('should return default plugins', () => {
|
47
|
-
expect(baseConfig.plugins.length).toEqual(
|
47
|
+
expect(baseConfig.plugins.length).toEqual(2)
|
48
48
|
})
|
49
49
|
|
50
50
|
test('should return default resolveLoader', () => {
|
@@ -53,7 +53,7 @@ describe('Base config', () => {
|
|
53
53
|
|
54
54
|
test('should return default resolve.modules with additions', () => {
|
55
55
|
expect(baseConfig.resolve.modules).toEqual([
|
56
|
-
resolve('app', '
|
56
|
+
resolve('app', 'packs'),
|
57
57
|
resolve('app/assets'),
|
58
58
|
resolve('/etc/yarn'),
|
59
59
|
resolve('some.config.js'),
|
@@ -4,19 +4,19 @@
|
|
4
4
|
const { basename, dirname, join, relative, resolve } = require('path')
|
5
5
|
const extname = require('path-complete-extname')
|
6
6
|
const PnpWebpackPlugin = require('pnp-webpack-plugin')
|
7
|
-
const { sync } = require('glob')
|
8
|
-
const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin')
|
7
|
+
const { sync: globSync } = require('glob')
|
9
8
|
const WebpackAssetsManifest = require('webpack-assets-manifest')
|
10
9
|
const webpack = require('webpack')
|
11
10
|
const rules = require('../rules')
|
11
|
+
const { isProduction } = require('../env')
|
12
12
|
const config = require('../config')
|
13
|
-
const {
|
13
|
+
const { moduleExists } = require('../utils/helpers')
|
14
14
|
|
15
15
|
const getEntryObject = () => {
|
16
16
|
const entries = {}
|
17
17
|
const rootPath = join(config.source_path, config.source_entry_path)
|
18
18
|
|
19
|
-
|
19
|
+
globSync(`${rootPath}/**/*.*`).forEach((path) => {
|
20
20
|
const namespace = relative(join(rootPath), dirname(path))
|
21
21
|
const name = join(namespace, basename(path, extname(path)))
|
22
22
|
let assetPaths = resolve(path)
|
@@ -52,8 +52,6 @@ const getModulePaths = () => {
|
|
52
52
|
const getPlugins = () => {
|
53
53
|
const plugins = [
|
54
54
|
new webpack.EnvironmentPlugin(process.env),
|
55
|
-
PnpWebpackPlugin,
|
56
|
-
new CaseSensitivePathsPlugin(),
|
57
55
|
new WebpackAssetsManifest({
|
58
56
|
entrypoints: true,
|
59
57
|
writeToDisk: true,
|
@@ -63,37 +61,39 @@ const getPlugins = () => {
|
|
63
61
|
})
|
64
62
|
]
|
65
63
|
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
}
|
76
|
-
} catch (e) {
|
77
|
-
/* Work out what to print here */
|
64
|
+
if (moduleExists('css-loader') && moduleExists('mini-css-extract-plugin')) {
|
65
|
+
const hash = isProduction ? '-[contenthash:8]' : ''
|
66
|
+
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
|
67
|
+
plugins.push(
|
68
|
+
new MiniCssExtractPlugin({
|
69
|
+
filename: `css/[name]${hash}.css`,
|
70
|
+
chunkFilename: `css/[id]${hash}.css`
|
71
|
+
})
|
72
|
+
)
|
78
73
|
}
|
79
74
|
|
80
75
|
return plugins
|
81
76
|
}
|
82
77
|
|
78
|
+
// Don't use contentHash except for production for performance
|
79
|
+
// https://webpack.js.org/guides/build-performance/#avoid-production-specific-tooling
|
80
|
+
const hash = isProduction ? '-[contenthash]' : ''
|
83
81
|
module.exports = {
|
84
82
|
mode: 'production',
|
85
83
|
output: {
|
86
|
-
filename:
|
87
|
-
chunkFilename:
|
88
|
-
|
89
|
-
|
84
|
+
filename: `js/[name]${hash}.js`,
|
85
|
+
chunkFilename: `js/[name]${hash}.chunk.js`,
|
86
|
+
|
87
|
+
// https://webpack.js.org/configuration/output/#outputhotupdatechunkfilename
|
88
|
+
hotUpdateChunkFilename: 'js/[id].[fullhash].hot-update.js',
|
90
89
|
path: config.outputPath,
|
91
90
|
publicPath: config.publicPath
|
92
91
|
},
|
93
92
|
entry: getEntryObject(),
|
94
93
|
resolve: {
|
95
|
-
extensions: ['.js', '.mjs', '.ts'],
|
96
|
-
modules: getModulePaths()
|
94
|
+
extensions: ['.js', '.jsx', '.mjs', '.ts', '.tsx', '.coffee'],
|
95
|
+
modules: getModulePaths(),
|
96
|
+
plugins: [PnpWebpackPlugin]
|
97
97
|
},
|
98
98
|
|
99
99
|
plugins: getPlugins(),
|
@@ -106,7 +106,7 @@ module.exports = {
|
|
106
106
|
optimization: {
|
107
107
|
splitChunks: { chunks: 'all' },
|
108
108
|
|
109
|
-
runtimeChunk:
|
109
|
+
runtimeChunk: 'single'
|
110
110
|
},
|
111
111
|
|
112
112
|
module: {
|