Skip to content

Commit d61ca62

Browse files
authored
Update CHANGELOG.md
1 parent d3f8c99 commit d61ca62

File tree

1 file changed

+45
-45
lines changed

1 file changed

+45
-45
lines changed

CHANGELOG.md

Lines changed: 45 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ We summarized all of the changes in a blog post!<br>
55

66
Check it out: **[Create React App 2.0: Babel 7, Sass, and More](https://reactjs.org/blog/2018/10/01/create-react-app-v2.html)**.
77

8-
Have you read it? Now let's see how to update your app to the latest version.
8+
It provides a high-level overview of new features and improvements. Now let's see how to update your app to the latest version in detail.
99

1010
# Migrating from 1.x to 2.0.3
1111

@@ -17,9 +17,43 @@ $ # or
1717
$ yarn add --exact [email protected]
1818
```
1919

20-
Next, follow the migration instructions below that are relevant to you.
20+
Like any major release, it contains a few breaking changes. We expect that they won't affect every users, but we provide them in detail below. We recommend to scan over these sections to see if something affects you. If we missed something, please file a new issue.
2121

22-
## Use dynamic `import()` instead of `require.ensure()`
22+
## Breaking Change: IE 9, IE 10, and IE 11 are no longer supported by default (but you can opt in!)
23+
24+
We have dropped default support for Internet Explorer 9, 10, and 11. If you still need to support these browsers, follow the instructions below.
25+
26+
First, install `react-app-polyfill`:
27+
28+
```bash
29+
$ npm install react-app-polyfill --save
30+
$ # or
31+
$ yarn add react-app-polyfill
32+
```
33+
34+
Next, place one of the following lines at the very top of `src/index.js`:
35+
36+
```js
37+
import 'react-app-polyfill/ie9'; // For IE 9-11 support
38+
import 'react-app-polyfill/ie11'; // For IE 11 support
39+
```
40+
41+
You can read more about [these polyfills here](https://github.com/facebook/create-react-app/tree/master/packages/react-app-polyfill).
42+
43+
## Breaking Change: Dynamic `import()` of a CommonJS module now has a `.default` property
44+
45+
[Webpack 4 changed the behavior of `import()`](https://medium.com/webpack/webpack-4-import-and-commonjs-d619d626b655) to be closer in line with the specification.
46+
47+
Previously, importing a CommonJS module did not require you specify the default export. In most cases, this is now required.
48+
If you see errors in your application about `... is not a function`, you likely need to update your dynamic import, e.g.:
49+
50+
```js
51+
const throttle = await import('lodash/throttle');
52+
// replace with
53+
const throttle = await import('lodash/throttle').then(m => m.default);
54+
```
55+
56+
## Breaking Change: `require.ensure()` is superseded by dynamic `import()`
2357

2458
We previously allowed code splitting with a webpack-specific directive, `require.ensure()`. It is now disabled in favor of `import()`. To switch to `import()`, follow the examples below:
2559

@@ -52,7 +86,7 @@ Promise.all([import('module-a'), import('module-b')]).then(([a, b]) => {
5286
});
5387
```
5488

55-
## The default Jest environment was changed to `jsdom`
89+
## Breaking Change: The default Jest environment was changed to `jsdom`
5690

5791
Look at the `test` entry in the `scripts` section of your `package.json`.
5892
Here's a table how to change it from "before" and "after", depending on what you have there:
@@ -62,17 +96,10 @@ Here's a table how to change it from "before" and "after", depending on what you
6296
| `react-scripts test --env=jsdom` | `react-scripts test` |
6397
| `react-scripts test` | `react-scripts test --env=node` |
6498

65-
## `.mjs` file extension support was removed
6699

67-
Change the extension of any files in your project using `.mjs` to just `.js`.
100+
## Breaking Change: Move advanced proxy configuration to `src/setupProxy.js`
68101

69-
It was removed because of inconsistent support from underlying tools. We will add it back after it stops being experimental, and Jest gets built-in support for it.
70-
71-
## Move advanced proxy configuration to `src/setupProxy.js`
72-
73-
This change is only required if you used the _advanced_ proxy configuration in v1.
74-
75-
To check if action is required, look for the `proxy` key in `package.json`. Then, follow the table below.
102+
To check if action is required, look for the `proxy` key in `package.json` and follow this table:
76103

77104
1. I couldn't find a `proxy` key in `package.json`
78105
- No action is required!
@@ -81,9 +108,9 @@ To check if action is required, look for the `proxy` key in `package.json`. Then
81108
3. The value of `proxy` is an object
82109
- Follow the migration instructions below.
83110

84-
If your `proxy` is an object, that means you are using the advanced proxy configuration.
111+
**It's worth highlighting: if your `proxy` field is a `string`, e.g. `http://localhost:5000`, or you don't have it, skip this section. This feature is still supported and has the same behavior.**
85112

86-
**Again, if your `proxy` field is a `string`, e.g. `http://localhost:5000`, you do not need to do anything. This feature is still supported and has the same behavior.**
113+
If your `proxy` is an object, that means you are using the advanced proxy configuration. It has become fully customizable so we removed the limited support for the object-style configuration. Here's how to recreate it.
87114

88115
First, install `http-proxy-middleware` using npm or Yarn:
89116

@@ -129,39 +156,12 @@ module.exports = function(app) {
129156

130157
You can also use completely custom logic there now! This wasn't possible before.
131158

132-
## Internet Explorer is no longer supported by default (but you can opt in!)
133-
134-
We have dropped default support for Internet Explorer 9, 10, and 11. If you still need to support these browsers, follow the instructions below.
159+
## Breaking Change: `.mjs` file extension support was removed
135160

136-
First, install `react-app-polyfill`:
137-
138-
```bash
139-
$ npm install react-app-polyfill --save
140-
$ # or
141-
$ yarn add react-app-polyfill
142-
```
143-
144-
Next, place one of the following lines at the very top of `src/index.js`:
145-
146-
```js
147-
import 'react-app-polyfill/ie9'; // For IE 9-11 support
148-
import 'react-app-polyfill/ie11'; // For IE 11 support
149-
```
150-
151-
You can read more about [these polyfills here](https://github.com/facebook/create-react-app/tree/master/packages/react-app-polyfill).
152-
153-
## The behavior of a CommonJS `import()` has changed
154-
155-
[Webpack 4 changed the behavior of `import()`](https://medium.com/webpack/webpack-4-import-and-commonjs-d619d626b655) to be closer in line with the specification.
161+
Change the extension of any files in your project using `.mjs` to just `.js`.
156162

157-
Previously, importing a CommonJS module did not require you specify the default export. In most cases, this is now required.
158-
If you see errors in your application about `... is not a function`, you likely need to update your dynamic import, e.g.:
163+
It was removed because of inconsistent support from underlying tools. We will add it back after it stops being experimental, and Jest gets built-in support for it.
159164

160-
```js
161-
const throttle = await import('lodash/throttle');
162-
// replace with
163-
const throttle = await import('lodash/throttle').then(m => m.default);
164-
```
165165

166166
## **Anything missing?**
167167

0 commit comments

Comments
 (0)