javascript - SCRIPT1002 Syntax Error in vendor.js - Angular 8 IE11 - Stack Overflow

admin管理员组

文章数量:1429636

Trying to get Angular to work in IE 11. I tried everything I found on the web already.

I'm getting the following errors:

SCRIPT1002: Syntax error

File: vendor.js, Line: 110874, Column: 40

Line 110874

args[0].replace(/%[a-zA-Z%]/g, match => {
    if (match === '%%') {
        return;
    }
    index++;
    if (match === '%c') {
        // We only are interested in the *last* %c
        // (the user may have provided their own)
        lastC = index;
    }
});

I have already made the remended es5 configurations indicated by the angle and I am running with these configurations ( Configuring serves for ES5).

My polyfills.ts:

/** IE10 and IE11 requires the following for NgClass support on SVG elements */
import 'classlist.js';  // Run `npm install --save classlist.js`.

/** IE10 and IE11 requires the following for the Reflect API. */
import 'core-js/es6/reflect';
import 'web-animations-js';  // Run `npm install --save web-animations-js`.
import 'zone.js/dist/zone';  // Included with Angular CLI.

My tsconfig.json:

{
    "pileOnSave": false,
    "pilerOptions": {
        "baseUrl": "./",
        "outDir": "./dist/out-tsc",
        "sourceMap": true,
        "declaration": false,
        "module": "esnext",
        "moduleResolution": "node",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "importHelpers": true,
        "target": "es2015",
        "typeRoots": [
            "node_modules/@types"
        ],
        "lib": [
            "es2018",
            "dom"
        ]
    }
}

My tsconfig.es5.json:

{
    "extends": "./tsconfig.json",
    "pilerOptions": {
        "target": "es5" 
     }
   }

I'm using angular 8 and primeng; And I run with ng serve -- configuration es5;

Update: From what I discovered the problem occurs with the dependencies of the socket-io-client I am using. Researching a little it seems that the problem has to do with the socket-io-client's debug and babel dependencies. I really need to use the socket on my system so I am still looking for a solution. But if I remove the socket-io-client it will run normally.

I found the source of the problem through these two topics:

Trying to get Angular to work in IE 11. I tried everything I found on the web already.

I'm getting the following errors:

SCRIPT1002: Syntax error

File: vendor.js, Line: 110874, Column: 40

Line 110874

args[0].replace(/%[a-zA-Z%]/g, match => {
    if (match === '%%') {
        return;
    }
    index++;
    if (match === '%c') {
        // We only are interested in the *last* %c
        // (the user may have provided their own)
        lastC = index;
    }
});

I have already made the remended es5 configurations indicated by the angle and I am running with these configurations (https://angular.io/guide/deployment Configuring serves for ES5).

My polyfills.ts:

/** IE10 and IE11 requires the following for NgClass support on SVG elements */
import 'classlist.js';  // Run `npm install --save classlist.js`.

/** IE10 and IE11 requires the following for the Reflect API. */
import 'core-js/es6/reflect';
import 'web-animations-js';  // Run `npm install --save web-animations-js`.
import 'zone.js/dist/zone';  // Included with Angular CLI.

My tsconfig.json:

{
    "pileOnSave": false,
    "pilerOptions": {
        "baseUrl": "./",
        "outDir": "./dist/out-tsc",
        "sourceMap": true,
        "declaration": false,
        "module": "esnext",
        "moduleResolution": "node",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "importHelpers": true,
        "target": "es2015",
        "typeRoots": [
            "node_modules/@types"
        ],
        "lib": [
            "es2018",
            "dom"
        ]
    }
}

My tsconfig.es5.json:

{
    "extends": "./tsconfig.json",
    "pilerOptions": {
        "target": "es5" 
     }
   }

I'm using angular 8 and primeng; And I run with ng serve -- configuration es5;

Update: From what I discovered the problem occurs with the dependencies of the socket-io-client I am using. Researching a little it seems that the problem has to do with the socket-io-client's debug and babel dependencies. I really need to use the socket on my system so I am still looking for a solution. But if I remove the socket-io-client it will run normally.

I found the source of the problem through these two topics:

https://github./visionmedia/debug/issues/729

https://github./babel/babel/issues/10707

• javascript
• angular
• typescript
• ecmascript-6
• internet-explorer-11

Share Improve this question Follow edited Jun 20, 2020 at 9:12 CommunityBot 111 silver badge asked Feb 5, 2020 at 13:31 Jean SilveiraJean Silveira 14922 gold badges22 silver badges88 bronze badges 6

• 2 The vendor file is other node_modules files that are not transpiled. I think the code es from a debug from babel or similar. You either have to turn debug off or remove the library. For example see this github./visionmedia/debug/issues/701 – PeterS Commented Feb 5, 2020 at 13:46
• Also note that "target": "es2015" Will produce code the Internet Explorer doesn't support. – Aluan Haddad Commented Feb 5, 2020 at 14:20
• @aluanhaddad I make a tsconfig.es5.json with target in es5 and i run with this configuration. Do you still need to change tsconfig.json? – Jean Silveira Commented Feb 5, 2020 at 14:27
• No, as long as that's the file that's being used by webpack When you're getting these errors Then that's fine. – Aluan Haddad Commented Feb 5, 2020 at 14:28
• @peterS If that's the case, the problem is plicated because I don't use babel directly, but some libraries I use depend on it. – Jean Silveira Commented Feb 5, 2020 at 14:29

 |  Show 1 more ment

1 Answer 1

Sorted by: Reset to default 2

The issue is arrow functions not being transpiled successfully. Have you followed the steps in this answer to support Angular 8 in IE 11? If you have followed the steps and the problem still persistes, it might because you used external js library containing arrow functions.

Angular CLI doesn't transpile Javascript code. Third-party code is expected to be in the appropriate format. You should use an ES5 version of the library to make it patible with IE 11.

You could also refer to this thread, set lib to "es5", "es6", "dom" to see if it works. If not working, just use an ES5 library version.

---------------------------------------------------------------------Edit-------------------------------------------------------------

You could use exclude property in webpack.config.js or babel.config.js to transpile modules. We could change this:

...
  exclude: /node_modules/,
...

into this:

...
  exclude: /node_modules\/(?!name-of-untranspiled-module)/,
...

Reference: How to handle npm modules which include es6

本文标签： javascriptSCRIPT1002 Syntax Error in vendorjsAngular 8 IE11Stack Overflow