Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/442.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript babel插件转换箭头函数不适用于node.js文件和网页包_Javascript_Node.js_Typescript_Webpack_Babeljs - Fatal编程技术网

Javascript babel插件转换箭头函数不适用于node.js文件和网页包

Javascript babel插件转换箭头函数不适用于node.js文件和网页包,javascript,node.js,typescript,webpack,babeljs,Javascript,Node.js,Typescript,Webpack,Babeljs,在我用Webpack4在react-typescript应用程序中安装TypeForm后,它在InternetExplorer11中停止工作。我需要对该浏览器的支持,因为该应用程序将用作Office附加模块,而且因为我们只有Office 2016,所以更新的Edge(Chromium)WebView未集成 问题是至少有一个箭头函数没有从node.js传输。 以下函数被绑定到我的javascript文件中,并导致IE 11中出现错误: /***/ "./node_modules/debu

在我用Webpack4在react-typescript应用程序中安装TypeForm后,它在InternetExplorer11中停止工作。我需要对该浏览器的支持,因为该应用程序将用作Office附加模块,而且因为我们只有Office 2016,所以更新的Edge(Chromium)WebView未集成

问题是至少有一个箭头函数没有从node.js传输。 以下函数被绑定到我的javascript文件中,并导致IE 11中出现错误:

/***/ "./node_modules/debug/src/browser.js":
/*!*******************************************!*\
  !*** ./node_modules/debug/src/browser.js ***!
  \*******************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {

/* WEBPACK VAR INJECTION */(function(process) {/* eslint-env browser */

/**
 * This is the web browser implementation of `debug()`.
 */

exports.log = log;
exports.formatArgs = formatArgs;

// ..........

 /**
 * Colorize log arguments if enabled.
 *
 * @api public
 */

function formatArgs(args) {
    args[0] = (this.useColors ? '%c' : '') +
        this.namespace +
        (this.useColors ? ' %c' : ' ') +
        args[0] +
        (this.useColors ? '%c ' : ' ') +
        '+' + module.exports.humanize(this.diff);

    if (!this.useColors) {
        return;
    }

    const c = 'color: ' + this.color;
    args.splice(1, 0, c, 'color: inherit');

    // The final "%c" is somewhat tricky, because there could be other
    // arguments passed either before or after the %c, so we need to
    // figure out the correct index to insert the CSS into
    let index = 0;
    let lastC = 0;
    args[0].replace(/%[a-zA-Z%]/g, match => { // <===== Not transpiled <==================
        if (match === '%%') {
            return;
        }
        index++;
        if (match === '%c') {
            // We only are interested in the *last* %c
            // (the user may have provided their own)
            lastC = index;
        }
    });

    args.splice(lastC, 0, c);
}
package.json

{
    "name": "some-app",
    "version": "0.0.1",
    "private": true,
    "scripts": {
        "serve": "webpack-dev-server",
    },
    "dependencies": {
        "@babel/runtime": "^7.12.5",
        "@fluentui/react": "^7.150.0",
        "core-js": "^3.7.0",
        "dotenv": "^8.2.0",
        "react": "^16.14.0",
        "react-dom": "^16.14.0",
        "react-native-sqlite-storage": "file:./shims/react-native-sqlite-storage",
        "react-scripts": "^3.4.4",
        "reflect-metadata": "^0.1.13",
        "typeorm": "^0.2.29"
    },
    "devDependencies": {
        "@babel/core": "^7.12.3",
        "@babel/plugin-proposal-class-properties": "^7.12.1",
        "@babel/plugin-proposal-decorators": "^7.12.1",
        "@babel/plugin-proposal-object-rest-spread": "^7.12.1",
        "@babel/plugin-transform-arrow-functions": "^7.12.1",
        "@babel/plugin-transform-runtime": "^7.12.1",
        "@babel/preset-env": "^7.12.1",
        "@babel/preset-react": "^7.12.5",
        "@babel/preset-typescript": "^7.12.1",
        "@testing-library/jest-dom": "^4.2.4",
        "@testing-library/react": "^9.4.0",
        "@testing-library/user-event": "^7.2.1",
        "@types/jest": "^24.0.25",
        "@types/node": "^14.14.7",
        "@types/office-js": "^1.0.147",
        "@types/office-runtime": "^1.0.17",
        "@types/react": "^16.9.56",
        "@types/react-dom": "^16.9.9",
        "babel-loader": "^8.2.1",
        "css-loader": "^5.0.1",
        "html-loader": "^1.3.2",
        "html-webpack-plugin": "^4.5.0",
        "ts-loader": "^8.0.11",
        "typescript": "^4.0.5",
        "webpack-cli": "^3.3.12",
        "webpack-dev-server": "^3.11.0"
    }
}
webpack.config.js

const path = require('path');
const HtmlWebPackPlugin = require('html-webpack-plugin');

module.exports = {
    entry: [
        'core-js/stable',
        './src/index.tsx'
    ],
    mode: 'development',
    devtool: 'inline-source-map',
    resolve: {
        extensions: ['.ts', '.tsx', '.js', '.jsx'],
    },
    module: {
        rules: [
            {
                test: /\.(js|jsx|ts|tsx)$/,
                exclude: /node_modules/,
                loader: 'babel-loader',
            },
            {
                test: /\.css$/i,
                use: ['style-loader', 'css-loader'],
            }
        ],
    },
    output: {
        filename: 'js/bundle.js',
        path: path.resolve(__dirname, 'build'),
    },
    plugins: [
        new HtmlWebPackPlugin({
            template: './public/index.html',
            filename: 'index.html',
        }),
    ],
    devServer: {
        contentBase: path.join(__dirname, 'build'),
        compress: true,
        port: 3003,
    },
};
如果这些信息没有帮助,我可以将一个示例上载到github。
提前谢谢

const path = require('path');
const HtmlWebPackPlugin = require('html-webpack-plugin');

module.exports = {
    entry: [
        'core-js/stable',
        './src/index.tsx'
    ],
    mode: 'development',
    devtool: 'inline-source-map',
    resolve: {
        extensions: ['.ts', '.tsx', '.js', '.jsx'],
    },
    module: {
        rules: [
            {
                test: /\.(js|jsx|ts|tsx)$/,
                exclude: /node_modules/,
                loader: 'babel-loader',
            },
            {
                test: /\.css$/i,
                use: ['style-loader', 'css-loader'],
            }
        ],
    },
    output: {
        filename: 'js/bundle.js',
        path: path.resolve(__dirname, 'build'),
    },
    plugins: [
        new HtmlWebPackPlugin({
            template: './public/index.html',
            filename: 'index.html',
        }),
    ],
    devServer: {
        contentBase: path.join(__dirname, 'build'),
        compress: true,
        port: 3003,
    },
};