Why does getModelJSON on transformer.js throw an error?

I'm using transformer.js within my Angular app. Locally I dont get any errors but on deployment I get the following error:

dialog-agent.component.ts:39 ERROR SyntaxError: Unexpected token '<', "<!doctype "... is not valid JSON
at JSON.parse (<anonymous>)
at hub.js:581:17
at Generator.next (<anonymous>)
at asyncGeneratorStep (asyncToGenerator.js:3:1)
at _next (asyncToGenerator.js:17:1)
at _ZoneDelegate.invoke (zone.js:369:28)
at Object.onInvoke (core.mjs:7251:33)
at _ZoneDelegate.invoke (zone.js:368:34)
at ZoneImpl.run (zone.js:111:43)
at zone.js:2538:40


This seems to be a known error as mentioned here: Transformer.js model fails to parse JSON in client-side Next.js example. As you can see I added the same fix into my app:

constructor() {
this.initializeQnA();
}

async initializeQnA() {
this.qnaPipeline = await pipeline('question-answering');
env.allowLocalModels = false;
env.useBrowserCache = false;
}


Sadly, this is isnt working. You can reproduce it here https://mavilio-92fbb--reproduction-j15rn0d0.web.app/. IMO I think I made a mistake but I just cannot find it.

Do you know how to fix it?

Continue reading...