Skip to content

Commit d12cb4f

Browse files
committed
Discuss params when webpack.config.js exports a function
* Expand on how --env arguments gets translated into the env parameter. * Briefly explain the argv parameter.
1 parent 6cdeed0 commit d12cb4f

File tree

2 files changed

+32
-18
lines changed

2 files changed

+32
-18
lines changed

content/api/cli.md

+19-10
Original file line numberDiff line numberDiff line change
@@ -110,16 +110,6 @@ Specifies a different [configuration](/configuration) file to pick up. Use this
110110
webpack --config example.config.js
111111
```
112112

113-
**Specify build environment**
114-
115-
Send [environment](/configuration/configuration-types) variable to be used in webpack config file.
116-
117-
118-
```bash
119-
webpack --env.production # sets production to true
120-
webpack --env.platform=web # sets platform to "web"
121-
```
122-
123113
**Print result of webpack as a JSON**
124114

125115
```bash
@@ -129,6 +119,25 @@ webpack --json > stats.json
129119

130120
In every other case, webpack prints out a set of stats showing bundle, chunk and timing details. Using this option the output can be a JSON object. This response is accepted by webpack's [analyse tool](https://webpack.github.com/analyse), or chrisbateman's [webpack-visualizer](https://chrisbateman.github.io/webpack-visualizer/), or th0r's [webpack-bundle-analyzer](https://github.com/th0r/webpack-bundle-analyzer). The analyse tool will take in the JSON and provide all the details of the build in graphical form.
131121

122+
### Environment options
123+
124+
When the webpack configuration exports a function, an "[environment](/configuration/configuration-types)" may be passed to it.
125+
126+
```bash
127+
webpack --env.production # sets env.production == true
128+
webpack --env.platform=web # sets env.platform == "web"
129+
```
130+
131+
The `--env` argument accepts various syntaxes:
132+
133+
| Invocation | Resulting env |
134+
|-------------------------------|---------------------------|
135+
| webpack --env prod | "prod" |
136+
| webpack --env.prod | { prod: true } |
137+
| webpack --env.prod=1 | { prod: 1 } |
138+
| webpack --env.prod=foo | { prod: "foo" } |
139+
| webpack --env.prod --env.min | { prod: true, min: true } |
140+
| webpack --env.prod --env min | [{ prod: true }, "min"] |
132141

133142
### Output Options
134143

content/configuration/configuration-types.md

+13-8
Original file line numberDiff line numberDiff line change
@@ -11,21 +11,26 @@ contributors:
1111
Besides exporting a single config object, there are a few more ways that cover other needs as well.
1212

1313

14-
## Exporting a function to use `--env`
14+
## Exporting a function to use `--env` and `argv`
1515

1616
Eventually you will find the need to disambiguate in your `webpack.config.js` between [development](/guides/development) and [production builds](/guides/production). You have (at least) two options:
1717

18-
Instead of exporting a configuration object, you may return a function which accepts an environment as argument. When running webpack, you may specify build environment keys via `--env`, such as `--env.production` or `--env.platform=web`.
18+
One option is to export a function from your webpack config instead of exporting an object. The function will be invoked with two arguments:
19+
20+
* An environment as the first parameter. See the [environment options CLI documentation](/api/cli#environment-options) for syntax examples.
21+
22+
* An options map (`argv`) as the second parameter. This describes the options passed to webpack, with keys such as [`output-filename`](/api/cli/#output-options) and [`optimize-minimize`](/api/cli/#optimize-options).
1923

2024
```diff
2125
-module.exports = {
22-
+module.exports = function(env) {
26+
+module.exports = function(env, argv) {
2327
+ return {
24-
plugins: [
25-
new webpack.optimize.UglifyJsPlugin({
26-
+ compress: env.production // compress only in production build
27-
})
28-
]
28+
+ devtool: env.production ? 'source-maps' : 'eval',
29+
plugins: [
30+
new webpack.optimize.UglifyJsPlugin({
31+
+ compress: argv['optimize-minimize'] // only if -p or --optimize-minimize were passed
32+
})
33+
]
2934
+ };
3035
};
3136
```

0 commit comments

Comments
 (0)