Lỗi uncaught error only one instance of babel-polyfill is allowed

After adding genomelink node module to my app and I have this error. Please recommend a way to fix this. Thank you.

yarn run v1.3.2 $ nodemon app.js --exec babel-node [nodemon] 1.11.0 [nodemon] to restart at any time, enter `rs` [nodemon] watching: *.* [nodemon] starting `babel-node app.js` /home/vincent/my-genome-link/node_modules/genomelink-node/lib/genomelink-node.min.js:1 [function [exports, require, module, __filename, __dirname] { !function[t,n]{"object"==typeof exports&&"object"==typeof module?module.exports=n[require["isomorphic-fetch"]]:"function"==typeof define&&define.amd?define["genomelink-node",["isomorphic-fetch"],n]:"object"==typeof exports?exports["genomelink-node"]=n[require["isomorphic-fetch"]]:t["genomelink-node"]=n[t["isomorphic-fetch"]]}[this,function[t]{return function[t]{function n[e]{if[r[e]]return r[e].exports;var i=r[e]={i:e,l:!1,exports:{}};return t[e].call[i.exports,i,i.exports,n],i.l=!0,i.exports}var r={};return n.m=t,n.c=r,n.d=function[t,r,e]{n.o[t,r]||Object.defineProperty[t,r,{configurable:!1,enumerable:!0,get:e}]},n.n=function[t]{var r=t&&t.__esModule?function[]{return t.default}:function[]{return t};return n.d[r,"a",r],r},n.o=function[t,n]{return Object.prototype.hasOwnProperty.call[t,n]},n.p="",n[n.s=126]}[[function[t,n,r]{var e=r[2],i=r[21],o=r[12],u=r[13],c

Error: only one instance of babel-polyfill is allowed at Object. [/home/vincent/my-genome-link/node_modules/genomelink-node/lib/genomelink-node.min.js:1:41109] at Object. [/home/vincent/my-genome-link/node_modules/genomelink-node/lib/genomelink-node.min.js:1:41566] at n [/home/vincent/my-genome-link/node_modules/genomelink-node/lib/genomelink-node.min.js:1:452] at Object. [/home/vincent/my-genome-link/node_modules/genomelink-node/lib/genomelink-node.min.js:1:40918] at n [/home/vincent/my-genome-link/node_modules/genomelink-node/lib/genomelink-node.min.js:1:452] at /home/vincent/my-genome-link/node_modules/genomelink-node/lib/genomelink-node.min.js:1:809 at /home/vincent/my-genome-link/node_modules/genomelink-node/lib/genomelink-node.min.js:1:820 at r [/home/vincent/my-genome-link/node_modules/genomelink-node/lib/genomelink-node.min.js:1:81] at Object. [/home/vincent/my-genome-link/node_modules/genomelink-node/lib/genomelink-node.min.js:1:328] at Module._compile [module.js:635:30]

Comments are closed.

On a site with a theme that uses webpack and babel [with no issue], once Oasis Workflow is activated an error is thrown in the console

Uncaught Error: only one instance of babel-polyfill is allowed

Is it possible to compile Oasis Workflow in a way so that it doesn’t re-initiate babel-polyfill if it is already initiated?

I'm submitting a bug report

Webpack Version: 4.43.0

Babel Core Version: 7.9.6

Babel Loader Version: 8.1.0

Please tell us about your environment: Windows 10

Current behavior: I have console error with message "VM2118 content.js:9 Uncaught Error: only one instance of babel-polyfill is allowed at Object. [VM1806 content.js:9] at Object. [VM1806 content.js:9] at r [VM1806 content.js:1] at Object. [VM1806 content.js:10] at r [VM1806 content.js:1] at VM1806 content.js:1 at VM1806 content.js:1" on every page in my application. Actually I don't use babel-polyfill, I use @babel/plugin-transform-runtime instead.

Expected/desired behavior: I haven't console error

  • If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem along with a gist/jsbin of your webpack configuration.

package.json:

{
  "version": "1.0.0",
  "name": "app",
  "private": true,
  "devDependencies": {
    "@babel/core": "^7.9.6",
    "@babel/plugin-transform-runtime": "^7.9.6",
    "@babel/preset-env": "^7.9.6",
    "@babel/preset-react": "^7.9.4",
    "@babel/runtime": "^7.9.6",
    "@storybook/addon-cssresources": "^5.3.19",
    "@storybook/react": "^5.3.18",
    "babel-loader": "^8.1.0",
    "clean-webpack-plugin": "^0.1.16",
    "css-loader": "^2.1.0",
    "extract-text-webpack-plugin": "^4.0.0-beta.0",
    "file-loader": "^6.0.0",
    "install": "^0.12.2",
    "npm": "^6.14.5",
    "style-loader": "^0.23.1",
    "webpack": "^4.29.0",
    "webpack-cli": "^3.3.11"
  },
  "dependencies": {
    "@aspnet/signalr": "^1.0.3",
    "bootstrap": "4.3.1",
    "bootstrap-table": "^1.15.5",
    "classnames": "^2.2.6",
    "jquery": "^3.4.1",
    "jquery-toast-plugin": "^1.3.2",
    "jquery-validation": "1.14.0",
    "jquery-validation-unobtrusive": "3.2.10",
    "popper.js": "^1.14.7",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-paginate": "^6.3.2",
    "tinymce": "5.0.0",
    "underscore": "1.9.1"
  },
  "scripts": {
    "dev": "webpack --mode development",
    "watch": "webpack --mode development --watch",
    "production": "webpack --mode production",
    "storybook": "start-storybook"
  },
  "-vs-binding": {
    "BeforeBuild": [
      "dev"
    ]
  }
}

webpack.config.js

"use strict";
{
    let path = require['path'];
    const webpack = require['webpack']; 
    const CleanWebpackPlugin = require['clean-webpack-plugin'];
    const ExtractTextPlugin = require['extract-text-webpack-plugin'];
    const bundleFolder = "wwwroot/bundle/";
    const siteCssPlugin = new ExtractTextPlugin[{ filename:  'style.css' }];
    const reactCssPlugin = new ExtractTextPlugin[{ filename:  'rstyle.css', allChunks: true }];
    module.exports = {
        entry: "./Scripts/js/site.js",
        output: {
            filename: 'script.js',
            path: path.resolve[__dirname, bundleFolder],
            libraryTarget: 'var',
            library: 'bslib'
        },
        devtool: 'inline-source-map',
        module: {
            rules: [
                {
                    test: /\.[js|jsx]$/,
                    exclude: ["/node_modules/"],
                    use: [
                      {
                        loader: "babel-loader"
                      },
                    ],
                },
                {
                    test: /\.[png|svg|jpg|gif]$/,
                    use: [{
                        loader: 'file-loader', options: {esModule: false}
                    }]
                },
                {
                    test: /\.[woff|woff2|eot|ttf|otf]$/,
                    use: [{
                        loader: 'file-loader', options: {esModule: false}
                    }]
                },
                {
                    test: /\.css$/,
                    exclude: [
                        path.resolve[__dirname, "React"]
                    ],
                    use: siteCssPlugin.extract[
                        {
                            fallback: 'style-loader',
                            use: ['css-loader']
                        }]
                },
                {
                    test: /\.css$/,
                    include: [
                        path.resolve[__dirname, "React"]
                    ],
                    use: reactCssPlugin.extract[
                        {
                            fallback: 'style-loader',
                            use: ['css-loader?modules,localIdentName="[name]-[local]-[hash:base64:6]"']
                        }]
                }
            ]
        },
        plugins: [
            new CleanWebpackPlugin[[bundleFolder]],
            siteCssPlugin,
            reactCssPlugin,
            new webpack.ProvidePlugin[{
                $: 'jquery',
                jQuery: 'jquery',
                signalR: "@aspnet/signalr"    
            }]
        ],
    };
}

.babelrc

{
    "presets": ["@babel/preset-env", "@babel/preset-react"],
    "plugins": [
        ["@babel/plugin-transform-runtime",
            {
                "regenerator": true
            }
        ]
    ]
}

Chủ Đề