当前位置:  开发笔记 > 编程语言 > 正文

在IE11及以下版本中,React 16:script1002语法错误

如何解决《在IE11及以下版本中,React16:script1002语法错误》经验,为你挑选了1个好方法。

截图IE11

在IE11及以下版本上查看我的应用时出现此错误.该应用程序还返回一个白页.

更糟糕的是,控制台没有显示行号来指示问题的位置/位置.这使得很难弄清楚出了什么问题.我正在使用Webpack 4和babel-polyfill.

谁能指出我正确的方向?

Webpack配置

const HtmlWebPackPlugin = require("html-webpack-plugin");
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const CleanWebpackPlugin = require("clean-webpack-plugin");
const CopyWebpackPlugin = require("copy-webpack-plugin");
const webpack = require('webpack');
const extractSass = new ExtractTextPlugin({
filename: "[name].[hash].css",
disable: process.env.NODE_ENV === "development"
});
module.exports = {
// mode: 'production',
entry: [
    'babel-polyfill',
    './src/index.js'
],
output: {
    publicPath: '/',
    filename: '[name].[hash].js',
},
module: {
    rules: [
        {
            test: /\.(js|jsx)$/,
            exclude: /node_modules/,
            use: {
                loader: "babel-loader"
            }
        },
        {
            test: /\.(png|svg|jpg|gif)$/,
            use: [{
                loader: "file-loader",
                options: {
                    // name: "./images/[name].[hash].[ext]",
                    name: '[path][name]-[hash:8].[ext]'
                },

            }
            ],

        },
        {
            test: /\.html$/,
            use: [
                {
                    loader: "html-loader",
                    options: { minimize: true }
                }
            ]
        },
        {
            test: /\.scss$/,
            use: extractSass.extract({
                use: [
                    {
                        loader: "css-loader",
                        options: {
                            minimize: true,
                            // sourceMap: true
                        }
                    },
                    {
                        loader: "sass-loader"
                    }],
                // use style-loader in development
                fallback: "style-loader"
            })
        },
        {
            test: /\.css$/,
            use: extractSass.extract({
                fallback: "style-loader",
                use: "css-loader"
            })
        }

    ]
},
devServer: {
    historyApiFallback: true,
    contentBase: './dist',
    hot: true,
},
plugins: [
    extractSass,
    // new ExtractTextPlugin('[name].[hash].css'),
    new CopyWebpackPlugin([
        {from:'src/assets/img/favicon.png',to:'src/assets/img'}
    ]),
    new HtmlWebPackPlugin({
        template: "./src/index.html",
        filename: "./index.html"
    }),
    new CleanWebpackPlugin(['dist']),
    new webpack.NamedModulesPlugin(),
    new webpack.HotModuleReplacementPlugin(),

],
optimization: {
    splitChunks: {
        cacheGroups: {
            commons: {
                test: /[\\/]node_modules[\\/]/,
                name: 'vendor',
                chunks: 'all'
            }
        }
    }
},

};



1> RobertMcReed..:

我想重申Jornve意识到的事情,因为我花了一段时间来解决这个问题.该查询字符串包将无法在IE浏览器.正如它在文档中所述,

该模块面向Node.js 6或更高版本以及最新版本的Chrome,Firefox和Safari.如果您想要支持旧版浏览器,或者,如果您的项目使用的是create-react-app,请使用版本5:npm install query-string @ 5.

删除依赖项并编写自己的函数实现为我解决了问题.我没有尝试使用该软件包的第5版,但也许这也会解决它.

推荐阅读
跟我搞对象吧
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有