ReadFile is not a function in Angular

[ArkasDev]

I would like to integrate Rivescript into an Angular application directly into the frontend. Unfortunately I get the following error message. Can anyone help me? How can I add the brain without fs for web clients?

  private initBot(): void {
    const brain: string[] = ['./assets/chat-bot-brain/small-talk.rive'];
    this.bot
      .loadFile(brain)
      .then(() => {
        this.bot.sortReplies();
      })
      .catch((error) => {
        console.error(error)
      });
  }

TypeError: self._node.fs.readFile is not a function at rivescript.js:462 at new ZoneAwarePromise (zone.js:913) at RiveScript._callee3$ (rivescript.js:460) at tryCatch (runtime.js:63) at Generator.invoke [as _invoke] (runtime.js:293) at Generator.next (runtime.js:118) at asyncGeneratorStep (asyncToGenerator.js:3) at _next (asyncToGenerator.js:25) at asyncToGenerator.js:32 at new ZoneAwarePromise (zone.js:913)

[kirsle]

In case others find this ticket via google searches or whatever:

The loadFile() method can work in a web environment (using ajax requests to download the .rive file), but RiveScript needs to be built to know it's a web environment, and it currently detects this by checking the process.browser variable which is set by Webpack and Browserify when packaging the code for web. Otherwise RiveScript assumes it's running in a node.js environment with access to the file system.

In either case, the stream() function can also be used to load RiveScript text into the bot, so if your build process didn't set process.browser and you have the issue described in the OP you might ajax-request your .rive file yourself and stream() the data into the bot.