Monday, 10 June 2019

Angular 7+ Web3js, IE11 throw Expected identifier SCRIPT1010 on vendor.js in WEBPACK VAR INJECTION

I have issue with Expected identifier ERROR code: SCRIPT1010 which points on vendor.js in WEBPACK VAR INJECTION section. Debugger points on line with:

const { keccak256, keccak256s } = __webpack_require__(/*! ./hash */ "./node_modules/web3-eth-accounts/node_modules/eth-lib/lib/hash.js");

tsconfig

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

polyfils:

import 'classlist.js'
(window as any).__Zone_enable_cross_context_check = true;

index.html:

  <meta http-equiv="X-UA-Compatible" content="IE=edge" />

What shoud I do to fix that? Please for hints and comments, thanks!

Edit, ethereum service which is using problematic web3 lib, which had in dependency hash.js

import { Injectable } from '@angular/core';
import Web3 from 'web3';
import { Block } from 'web3-eth';
import { Observable, BehaviorSubject } from 'rxjs';
const abi = require('../abi/abi.json');

export class TrustedDocumentResponse<T> {
  public value: T;
  public errorCode: number;
  public errorMessage: string;

  constructor(value:T, errorCode:number = 0, erroMessage:string = "") {
      this.value = value;
      this.errorCode = errorCode;
      this.errorMessage = erroMessage;
  }
}

@Injectable({
  providedIn: 'root'
})
export class EthereumService {
  web3: Web3;
  contract: any;

  providers = Object.freeze({
    LOCALHOST: 'http://localhost:8546'
  });


  providerSource = new BehaviorSubject<string>(this.providers.INFURA);
  provider$ = this.providerSource.asObservable();

  constructor() {
    this.provider$.subscribe(provider => {
      this.web3 = new Web3(provider);
      console.log('eth sub');

    });

    this.contract = new this.web3.eth.Contract(abi, this.contractAddress);
    console.log('contract', this.contract);

  }

  getBlockTimestamp(blockNumber: number): Promise<Block> {
    return this.web3.eth.getBlock(blockNumber);
  }

  getDocumentIdWithContentHash(hash: string): Promise<any> {
    // return this.contract.methods.getDocumentIdWithContentHash(hash).then(result => console.log(result));
    console.log('serviceHash: ', hash);

    return new Promise<TrustedDocumentResponse<number>>((resolve) => {
      //
      let transactionObject: any = this.contract.methods.getDocumentIdWithContentHash(hash);
      transactionObject.call().then((result) => {
          console.log(result);

          resolve(new TrustedDocumentResponse<number>(result));
      }).catch((reason:Error) => {
          console.error(reason);
          resolve(new TrustedDocumentResponse<number>(null,1,reason.stack));
      });
  });
  }

  getDocument(id: number) {
    this.contract.methods.getDocument(id).then(result => console.log(result));
  }

  convertToBinary(data: any): Uint8Array {
    const index = data.indexOf(';base64,') + 8;
    const raw = window.atob(data.substring(index));

    let array = new Uint8Array(new ArrayBuffer(raw.length));
    for (let i = 0; i < raw.length; i++) {
        array[i] = raw.charCodeAt(i);
    }
    return array;
  }
}

I hope it will help.



from Angular 7+ Web3js, IE11 throw Expected identifier SCRIPT1010 on vendor.js in WEBPACK VAR INJECTION

No comments:

Post a Comment