Question

我正在IE 11.248.16299.0上测试ReactJs应用，目前收到此错误：

＆＃34; SCRIPT1010：预期标识符＆＃34;在线包含：

exports.default = assertString;

现在我知道这个错误意味着IE无法理解点符号，我是否会将此行重写为：

exports['default'] = assertString;

它会正常工作。

使用正确的解决方案可以通过向我的应用程序打包的Webpack提供正确的预设或插件来解决这个问题。不过我已经尝试了es2015，stage-0，babel-preset-env但是找不到任何解决方案或配置的正确组合。

顺便说一句，这些语法问题实际上是在流行的软件包中，例如＆＃39;验证器＆＃39;或者传单，我觉得很奇怪他们不会在IE11上工作，即使是这样宣传的。因此，我想，也许我有什么事情需要与包或者特别是npm？

在任何情况下，主要问题是在这种情况下，如何配置我的webpack以正确转换？

当前配置：

const webpackConfig = {
devtool: 'source-map',
entry: ['babel-polyfill', './src/index.js'],
output: {
    filename: 'webapp-XXXXXXXXX-[git-revision-version].js',
    publicPath: '/',
    path: path.resolve(__dirname, outputDir.development)
},
stats: {
    // quiet: true
},
devServer: {
    // quiet: true,
    port: PORT_NUMBER
},
plugins: [
    new webpack.DefinePlugin({
        'process.env': {
            NODE_ENV: JSON.stringify(process.env.NODE_ENV) || '"development"',
            CLIENT_VERSION: JSON.stringify(pkg.version) || '""'
        }
    }),
    new GitRevisionPlugin(),
    new HtmlWebpackPlugin({
        template: 'index.ejs'
    }),
    extractSass
],
module: {
    rules: [
        {
            test: /\.js$/,
            include: [path.resolve(__dirname, 'src'), path.resolve(__dirname, 'node_modules')],
            exclude: [
                /(bower_components)/,
                path.resolve(__dirname, 'node_modules/react-leaflet'),
                path.resolve(__dirname, 'node_modules/react-dom'),
                path.resolve(__dirname, 'node_modules/lodash')
            ],
            use: {
                loader: 'babel-loader',
                options: {
                    presets: [
                        'react',
                        [
                            'env',
                            {
                                targets: {
                                    browsers: ['last 2 versions']
                                }
                            }
                        ],
                        [
                            "es2015", {
                                "loose": false,
                                "modules": false
                            }
                        ],
                        'stage-0',
                    ],
                    plugins: [
                        'transform-class-properties',
                        'syntax-trailing-function-commas'
                    ]
                }
            }
        },
        {
            // images
            test: /\.(ico|jpe?g|png|gif)$/,
            use: {
                loader: 'file-loader',
                options: {
                    name: '../img/[name].[ext]'
                    // name: '[name].[ext]'
                }
            }
        },
        {
            test: /\.scss$/,
            use: extractSass.extract({
                use: [
                    {
                        loader: 'css-loader'
                    },
                    {
                        loader: 'sass-loader'
                    }
                ],
                // use style-loader in development
                fallback: 'style-loader'
            })
        }
    ]
}

}

Answer 1

对于那些稍后会偶然发现的人。

正如@Pointy正确指出的那样，由于保留字使用而发生此错误。要解决这个问题，你必须在babelrc或webpack配置中添加以下插件：

https://babeljs.io/docs/plugins/transform-es3-member-expression-literals/

和

https://www.npmjs.com/package/babel-preset-es2015

坦率地说，这个问题的名字“es3-member-expression-literals”让我感到困惑，因为我是业余网站开发人员。

你也很可能也需要这个：

https://babeljs.io/docs/plugins/transform-es3-property-literals/

这会转换保留的对象属性名称

IE11中的点符号属性访问器

1 个答案: