Question

我在下一行的bundle.js中使用@ material-ui / core在IE11中出现语法错误：

const withStyles = (stylesOrCreator, options = {}) => Component => { const {
withTheme = false,
flip = null,
name } = options

箭头功能在安装@ material-ui之前有效这是我的.babelrc：

{"presets": ["react", "env", "stage-2"],
 "plugins": ["transform-async-to-generator", 
"transform-es2015-arrow-functions" ,"transform-object-rest-spread", "transform-async-functions", ["transform-runtime", {
"polyfill": true,
"regenerator": true
 }]]
}

反应v16.3.2

Answer 1

看起来您正在使用Destructuring assignment，尝试使用插件ES2015 destructuring transform来帮助解决此问题：

{
 "presets": ["react", "env", "stage-2"],
 "plugins": [
   "transform-async-to-generator", 
   "transform-es2015-arrow-functions",
   "transform-object-rest-spread",
   "transform-async-functions",
   "transform-es2015-destructuring" // added
   [
     "transform-runtime", 
     {
       "polyfill": true,
       "regenerator": true
     }
   ]
 ]
}

希望这有帮助！

Answer 2

在IE11上进行测试时，我也遇到了这个问题。我不想在Material UI的代码上使用Babel，因为他们在内部对其进行处理。根据{{3}}：

Material-UI支持所有主要浏览器和平台的最新，稳定版本。我们还支持Internet Explorer11。您无需提供任何JavaScript polyfill，因为我们在内部和隔离地管理不受支持的浏览器功能。

后来我发现我们有一些不正确的导入并进行了纠正：

import Typography from '@material-ui/core/es/Typography/Typography' // incorrect
import Typography from '@material-ui/core/Typography' // correct

es模块的直接导入破坏了MUI的内部兼容性处理。

material-ui IE11语法错误

2 个答案: