编译 ES6 (ReactJS) 代码以使用 IE >=9答案

【问题标题】：Compiling ES6 (ReactJS) code to work with IE >=9编译 ES6 (ReactJS) 代码以使用 IE >=9
【发布时间】：2018-02-07 13:20:59
【问题描述】：

所以我一直在用 React JS 构建一个应用程序，并且一直在利用 ES6 提供的一些语法，例如：

使用 let 和 const
类组件
箭头函数（componentWillMount = () => {})
无构造函数状态声明（state = {someProperty: true}）

我在编译时遇到了一些问题。据我所知，我的代码似乎适用于大多数 chrome，但整个事情在 IE9 或 IE10 周围都崩溃了。设置我的 .babelrc 文件的正确方法是什么？（以下是我现在拥有的）

{
  "presets": [
    ["es2016"],
    "react"
  ],
  "plugins": [
    "babel-plugin-transform-class-properties"
  ]
}

对于任何知道如何为 Laravel-mix 进行设置的人也可以加分，因为我在 laravel 5.5 环境中构建了组件。（这是我的 webpack.mix.js 文件现在的样子）

mix.react('resources/assets/js/app.js', 'public/js/app.js')
    .js('resources/assets/js/cross-brand-nav.js', 'public/js/app.js')
    .js('resources/assets/js/FullWidthTabs.js', 'public/js/app.js')
    .js('resources/assets/js/universal-nav.js', 'public/js/app.js')
    .version()
    .combine([
        'resources/assets/bower_assets/jquery/dist/jquery.min.js',
        'resources/assets/bower_assets/moment/min/moment.min.js',
        'resources/assets/bower_assets/bootstrap/dist/js/bootstrap.js',
        'resources/assets/bower_assets/eonasdan-bootstrap-datetimepicker/build/js/bootstrap-datetimepicker.min.js',
        'resources/assets/js/admin.js'
    ], 'public/js/admin.js').version()
    .sass('resources/assets/sass/app.scss', 'public/css')
    .sass('resources/assets/bower_assets/components-font-awesome/scss/font-awesome.scss', 'public/css').version()
    .styles([
        'resources/assets/css/FullWidthTabs.css'
    ], 'public/css/pf.css')
    .styles([
        'resources/assets/bower_assets/bootstrap/dist/css/bootstrap.min.css',
        'resources/assets/bower_assets/eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.min.css'
        ], 'public/css/admin.css').version();

【问题讨论】：

标签： laravel reactjs babeljs laravel-mix

【解决方案1】：

尝试https://babeljs.io/repl/ 将您的代码转换为您想要的任何浏览器，它有很多转换选项，尝试一下，如果您有任何问题在这里发布，我们会提供帮助

【讨论】：