add docs for building with Rollup (#8799)
* add docs for building with Rollup * Tiny unrelated fix
Rich Harris committed
Jan 17, 2017 at 08:55 UTC
e69ff955f4960d4192107437f000e6bc08ffb804
2 files changed
+17
-1
docs/docs/installation.md
+5
-1
@@ -101,7 +101,7 @@ If you use [Create React App](https://github.com/facebookincubator/create-react-
101
102
#### Webpack
103
104
--Include both `DefinePlugin` and `UglifyJsPlugin` into your production Webpack configuration as described in [this guide](https://webpack.js.org/guides/production-build/).
104
+Include both `DefinePlugin` and `UglifyJsPlugin` into your production Webpack configuration as described in [this guide](https://webpack.js.org/guides/production-build/).
105
106
> **Note:**
107
>
@@ -111,6 +111,10 @@ If you use [Create React App](https://github.com/facebookincubator/create-react-
111
112
Run Browserify with `NODE_ENV` environment variable set to `production` and use [UglifyJS](https://github.com/mishoo/UglifyJS) as the last build step so that development-only code gets stripped out.
113
114
+#### Rollup
115
+
116
+Use [rollup-plugin-replace](https://github.com/rollup/rollup-plugin-replace) plugin together with [rollup-plugin-commonjs](https://github.com/rollup/rollup-plugin-commonjs) (in that order) to remove development-only code. [See this gist](https://gist.github.com/Rich-Harris/cb14f4bc0670c47d00d191565be36bf0) for a complete setup example.
117
+
118
### Using a CDN
119
120
If you don't want to use npm to manage client packages, the `react` and `react-dom` npm packages also provide single-file distributions in `dist` folders, which are hosted on a CDN:
docs/docs/optimizing-performance.md
+12
@@ -25,6 +25,18 @@ new webpack.DefinePlugin({
25
new webpack.optimize.UglifyJsPlugin()
26
```
27
28
+* For Rollup, you need to use the [replace](https://github.com/rollup/rollup-plugin-replace) plugin *before* the [commonjs](https://github.com/rollup/rollup-plugin-commonjs) plugin so that development-only modules are not imported. For a complete setup example [see this gist](https://gist.github.com/Rich-Harris/cb14f4bc0670c47d00d191565be36bf0).
29
+
30
+```js
31
+plugins: [
32
+ require('rollup-plugin-replace')({
33
+ 'process.env.NODE_ENV': JSON.stringify('production')
34
+ }),
35
+ require('rollup-plugin-commonjs')(),
36
+ // ...
37
+]
38
+```
39
+
40
The development build includes extra warnings that are helpful when building your apps, but it is slower due to the extra bookkeeping it does.
41
42
## Profiling Components with Chrome Timeline