想直接在浏览器写 ES6 语法，那么怎么解决低版本浏览器的兼容性问题呢？

This topic created in 2570 days ago, the information mentioned may be changed or developed.

最近我打算弄一个网站

打算使用 react+es6 来写

我是把 react 当成 jQuery 方式来用

也就是 standalone 方式来使用 react

高版本的浏览器是可以支持 es6，低版本有办法解决吗？

有没有办法，用一个 js 判断浏览器是否支持 es6，如果不支持，就加载一个文件，让浏览器支持 es6

如果浏览器支持 es6，就不额外加载文件

这样既能恶心低版本的浏览器，又能让高版本浏览器用的舒服

谢谢

ES6

浏览器

React

版本

11 replies • 2019-06-03 23:03:30 +08:00

greatbody

Jun 1, 2019

直接提示只兼容 chrome

greatbody

Jun 1, 2019

IE 的直接对不起，不支持。。。

find456789

Jun 1, 2019

@greatbody 谢谢，你说的对

Raincal

Jun 1, 2019

yixiang

Jun 1, 2019

不用 babel 的话，也没有 jsx，写着会很痛苦。

要用 babel 的话，转成 es5 也没啥吧。

IsaacYoung

Jun 1, 2019 via iPhone

babal 我记得可以直接引个脚本就是性能不太好

cnfczn

Jun 1, 2019 via Android

webpack+babel,祝你好运。我也刚接触这俩，主要用 babel 转译各种 es6 语法，webpack 负责打包。

lzxgh621

Jun 1, 2019 via iPhone

非商业项目的话
win10、IE11 访问的让他用 EDGE
win10 其它浏览器的让他升级
win10 以下让他换浏览器

1OF7G

Jun 1, 2019

babel-standalone： https://github.com/babel/babel-standalone

直接在浏览器里编译，React 也顺便可以用 jsx 了。完全不需要提前编译，缺点就是加载时慢一点。

```html

<div id="output"></div>

<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>

<script type="text/babel">
const getMessage = () => "Hello World";
document.getElementById('output').innerHTML = getMessage();
</script>

```

至于低版本才编译，那你可以判断下，然后手动调 babel 的 transform api

话说，webpack 简单配置一下，用起来也不麻烦。

tcdw

Jun 1, 2019 via Android

try {
new Function('const a = 4'); // 你想要测试的语法
es6Code();
} catch (e) {
es5Code();
}

SoloCompany

Jun 3, 2019

一般而言，只要测试几个 ES6 新增的 internal api 是否存在即可
比如 Object.entries