Skip to content

Commit ea7a201

Browse files
taiontimdorr
authored andcommitted
Remove section about ES modules and tree-shaking (#3410)
In practice, tree-shaking does not currently allow for the kind of bundle size reduction achievable using direct module imports, so we shouldn't encourage it as an option for minimizing bundle size.
1 parent 5555275 commit ea7a201

File tree

1 file changed

+4
-22
lines changed

1 file changed

+4
-22
lines changed
Lines changed: 4 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,16 @@
11
# Minimizing Bundle Size
22

3-
For convenience, React Router exposes its full API on the top-level `react-router` import. However, this causes the entire React Router library and its dependencies to be included in client bundles that include code that makes any imports from the top-level CommonJS bundle.
3+
For convenience, React Router exposes its full API on the top-level `react-router` import. However, this causes the entire React Router library and its dependencies to be included in client bundles that include code that imports from the top-level CommonJS bundle.
44

5-
There are two options for minimizing client bundle size by excluding unused modules.
5+
Instead, the bindings exported from `react-router` are also available in `react-router/lib`. When using CommonJS models, you can import directly from `react-router/lib` to avoid pulling in unused modules.
66

7-
8-
## Import from `react-router/lib`
9-
10-
Bindings exported from `react-router` are also available in `react-router/lib`. When using CommonJS models, you can import directly from `react-router/lib` to avoid pulling in unused modules.
11-
12-
Assuming you are transpiling ES2015 modules into CommonJS modules, instead of
7+
Assuming you are transpiling ES2015 modules into CommonJS modules, instead of:
138

149
```js
1510
import { Link, Route, Router } from 'react-router'
1611
```
1712

18-
use
13+
use:
1914

2015
```js
2116
import Link from 'react-router/lib/Link'
@@ -24,16 +19,3 @@ import Router from 'react-router/lib/Router'
2419
```
2520

2621
The public API available in this manner is defined as the set of imports available from the top-level `react-router` module. Anything not available through the top-level `react-router` module is a private API, and is subject to change without notice.
27-
28-
29-
## Use a Bundler with ES2015 Module Support
30-
31-
React Router offers a ES2015 module build and defines a `jsnext:main` entry point. Only if you are using a bundler that supports ES2015 modules and tree-shaking such as webpack 2 or Rollup, you can directly import from `react-router`, as long as you are correctly resolving to the ES2015 module build. Specifically, in those cases, you can write
32-
33-
```js
34-
import { Link, Route, Router } from 'react-router'
35-
```
36-
37-
Tree-shaking will ensure that only the relevant modules will be included in your bundle.
38-
39-
**Note:** Please do not import from the subdirectory with the ES module build directly. If you are using webpack 2, please add `jsnext:main` to `resolve.mainFields` (or `resolve.packageMains` for older versions of webpack 2).

0 commit comments

Comments
 (0)