fast-xml-parser in an Angular CLI environment about fast-xml-parser

[amitguptagwl]

@savvasmarkstatkus APIs are changed in v4.
Eg

const {XMLParser, XMLBuilder, XMLValidator} = require('fast-xml-parser');

if(XMLValidator.validate()){
    const parser = new XMLParser();
    let jsonObj = parser.parse(xmlData);
    
    const builder = new XMLBuilder();
    let samleXmlData = builder.build(jsonObj);
}

[amitguptagwl]

1. Are you facing problem when you include fast-xml-parser or when you use it in your code?
2. When you are importing other packages why are you using require to import fast-xml-parser?

I believe the problem is more related to syntax not the library. So please change it to import parser from fast-xml-parser and then try.

[jstolz]

Could you please provide me an exact syntax? Everything I try did not work

some errors
scripts.bundle.js:1 Uncaught ReferenceError: require is not defined
at scripts.bundle.js:1
(anonymous) @ scripts.bundle.js:1
core.js:3675 Angular is running in the development mode. Call enableProdMode() to enable the production mode.
i-hub-header.component.ts:21 onDashboardClicked(..) executed.
core.js:1440 ERROR TypeError: Cannot read property 'parse' of undefined
at FileReader.reader.onloadend (imp-exp.service.ts:33)
at ZoneDelegate.invoke (zone.js:388)
at Object.onInvoke (core.js:4733)
at ZoneDelegate.invoke (zone.js:387)
at Zone.runGuarded (zone.js:151)
at FileReader.eval (zone.js:129)
.....

My source code
`
import { Injectable } from '@angular/core';

//var fastXmlParser = require('fast-xml-parser');
import parser from 'fast-xml-parser';
//import { parser } from 'fast-xml-parser';

@Injectable()
export class ImpExpService {

private files: any;
private fileContent: any;

constructor() {

}

setLoadedFiles(loadedFiles: any) {

this.files = loadedFiles;

const reader = new FileReader();
for (let item of this.files) {

  reader.readAsText(item, 'utf8');

  var that = this;
  reader.onloadend = function () {

    that.fileContent = reader.result;
    debugger;
    var jsonObj = parser.parse(that.fileContent);
    debugger;
  }
}

}
}

`

[amitguptagwl]

I believe the issue is related to ES6 implementation. Check https://medium.com/the-node-js-collection/an-update-on-es6-modules-in-node-js-42c958b890c

Have you tried to import any other 3rd party library?

[jstolz]

Hi,
I found a solution, just add the line "declare var require: any;" before the require.
Regards Jürgen

import { Injectable } from '@angular/core';

import { ImportData } from 'thevoidmodelmodule/dist/shared';
import { SBKDispoListen, SBKOrder } from 'thevoidmodelmodule/dist/ihub';
import { MongoDBService } from '../mongo-db.service';

declare var require: any;
var fastXmlParser = require('fast-xml-parser');

@Injectable()
export class ImpExpService {

  private files: any;
  private fileContent: any;
  private sbkDispoListen: SBKDispoListen = null;

  constructor(private mongoDBService: MongoDBService) {

  }
....
}

[savvasmarkstatkus]

I had better luck just using v3.19.0 vs 4 in Angular. Didn't want to spend anymore time dealing with TS errors.

"fast-xml-parser": "^3.19.0",

import { parse } from "fast-xml-parser"; // Couldn't get v4 to work, v3 seemed to.

this.result = parse(xmlStr, options);

[savvasmarkstatkus]

With Angular 13 I was getting Type 'XMLParser' has no call signatures. I tweaked it based on your example and looks like I was missing the parser.parse. Thanks.