react-ie8：实践指南

时间：2026-09-11 11:40:02 编辑：袖梨来源：一聚教程网

团队讨论react-ie8时，我会先把用途说清楚：让您的 React 应用程序在 IE8 中运行。这类界面与前端开发工具真正难在视觉还原、交互状态和响应式细节容易遗漏，仓库说明只能作为第一层证据。与其反复读介绍，不如选一个包含多状态的真实组件完成实现，再依据尺寸、状态、可访问性、资源和不同视口表现做取舍。我的判断是，它更适合愿意逐状态验收界面质量的前端团队；若眼下没有这类需求，先保留观察即可。

中文 README

让您的 React 应用程序在 IE8 中运行

这真是一个令人沮丧的消息[从React v15开始，我们将停止React DOM对IE 8的支持][停止React IE 8对DOM的支持]。中国仍有超过18%的人在使用IE8。

不管怎样，react-ie8将持续为面临同样兼容问题的人们提供一系列的[示例]，并收集问题。

享受 react-ie8 [示例] 的乐趣，并随时 [打开问题]。

如何

首先你不应该再使用 React v15 或更高版本。只需使用 React v0.14 即可，它仍然支持 IE8。

如果您需要 React v0.14 的文档，请转到 http://react-ie8.xcatliu.com

使用CommonJS

我强烈建议使用 CommonJS 样式来包含所需的包。

首先安装这些软件包：

npm install --save es5-shim console-polyfill

然后将代码插入到条目文件的开头：

require('es5-shim');
require('es5-shim/es5-sham');
require('console-polyfill');

有关真实示例，请参阅React IE8 Hello World 示例。

反应静态样板

React Static Boilerplate 一个支持 IE8 的 React 静态样板，查看 Demo

其他问题

有些问题其实并不是React的问题，但我也列出如下：

错误信息	原因	解决方案	相关问题	示例
`Expected identifier`	您的代码或第三方包中使用了保留字，例如 `default`	使用 [es3ify] 或 [es3ify-loader] 转换您的代码	[#1]	[获取IE8]
`Exception thrown and not caught`	Babel 将您的 `export * from 'xxx'` 转换为 `Object.defineProperty`，它不支持 IE8 中的访问器属性	在条目文件顶部插入 `require('es5-shim')` `require('es5-shim/es5-sham')`，并且 DONOT 在代码中使用 `export * from 'xxx'`	[#2][#2] [#32][#32]	[你好世界]
`Object expected`	也许您正在使用 `fetch` 而不使用 polyfilled	使用 `es6-promise` 和 `fetch-ie8` 来填充 `fetch`	[#4]	[获取IE8]
`'Promise' is undefined`	`Promise` 需要在 IE8 中进行聚合填充	使用 `es6-promise` 来填充 `Promise`	[#5]	[获取IE8]
`Object doesn't support this property or method`	也许您正在使用 `Object.assign`	使用`core-js`进行polyfill	[#7]	[对象分配]
`'JSON' is undefined`	需要使用IE8标准模式	添加 `<!DOCTYPE html>` 和 `<meta http-equiv="X-UA-Compatible" content="IE=EDGE"/>`	[#8]	[你好世界]

如果您还有其他问题，请[打开问题]。

故障排除

[问题排查][问题排查]

参考

[例子]
[故障排除]
【React官方支持IE8】
[es5-垫片]
[es5-假]
[控制台-polyfill]
[es6-承诺]
[获取-ie8]

使你的 React 应用兼容 IE8

一个令人失望的消息：[从 React v15 开始，React DOM 将不会再支持 IE8 了][React IE 8 支持停止 DOM]。而[中国还有超过 18% 的人在使用IE8][IE8-in-中国]。

不管怎样，react-ie8 仍会提供一系列的[示例][示例]，还会收集问题，以便于给遇到兼容性问题的人一个参考。

快去查看 react-ie8 [示例][示例]吧，也欢迎[提交问题][打开一个问题]。

如何兼容 IE8

首先，你不应该使用 React v15 或更高版本。使用仍然支持 IE8 的 React v0.14 即可。

如果您需要查看 React v0.14 的文档，请访问：http://react-ie8.xcatliu.com

使用 CommonJS

强烈推荐使用 CommonJS 风格来引入需要的模块。

首先安装这些模块：

npm install --save es5-shim console-polyfill

然后把以下代码插入到入口文件最前面：

require('es5-shim');
require('es5-shim/es5-sham');
require('console-polyfill');

参考一个真实的例子：React IE8 Hello World Example。

使用 React 静态样板

React Static Boilerplate 一个创建好的支持 IE8 的 React 静态模板，可以查看演示

其他问题

一些问题其实并不是 React 的问题，不过我也把他们列出来了：

错误信息	原因	解决方案	相关问题	示例
`Expected identifier`	代码中或者第三方模块中使用了保留字，比如 `default`	使用 [es3ify] 或者 [es3ify-loader]	[#1]	[获取IE8]
`Exception thrown and not caught`	babel 把 `export * from 'xxx'` 编译编译为 `Object.defineProperty`，而 IE8 中不支持 accessor 属性	把 `require('es5-shim')` `require('es5-shim/es5-sham')` 插入到入口文件的最上方，并且在代码中不要使用 `export * from 'xxx'`	[#2][#2] [#32][#32]	[你好世界]
`Object expected`	可能你使用了 `fetch`	使用 `es6-promise` 和 `fetch-ie8` 填充材料	[#4]	[获取IE8]
`'Promise' is undefined`	`Promise` 需要填充	使用 `es6-promise` 填充材料	[#5]	[获取IE8]
`Object doesn't support this property or method`	可能你使用了 `Object.assign`	使用 `core-js` 填充材料	[#7]	[对象分配]
`'JSON' is undefined`	需要使用IE8标准模式	添加 `<!DOCTYPE html>` 和 `<meta http-equiv="X-UA-Compatible" content="IE=EDGE"/>`	[#8]	[你好世界]

如果您遇到其他问题，可以[提交一个问题][打开一个问题]。

故障排除

[问题排查][问题排查]

参考

[示例][示例]
[故障排除]
[React 官方对 IE8 的支持][React 官方对 IE8 的支持]
[es5-垫片]
[es5-假]
[控制台-polyfill]
[es6-承诺]
[获取-ie8]

推荐专题

最新下载

热门教程

react-ie8：实践指南

相关文章

热门栏目

php教程

asp.net教程

手机开发

css教程

网页制作

办公数码

jsp教程