Question: what am I missing adding RTF-to-HTML third-party library? ..

[Gennady-G]

Greetings Andrew!

Want to read rtf template and then create modified report in sp library.

https://www.npmjs.com/package/@iarna/rtf-to-html
https://github.com/iarna/rtf-to-html

I'm new in typescript and got stuck on "Uncaught Error: Cannot find module 'fs'" error..

Don't understand how to reference fs module (as I understand it should be part of NodeJs, but it is not found..)

My example code is:

import { loadContext } from "@utils/env";
import { logger } from "@utils/logger";
import { setupPnp } from "@utils/odata";

// import * as fs from "fs";         // <- tried to load like this
const fs = require("fs");            // and like this
import rtfToHTML from "@iarna/rtf-to-html";

loadContext()
  .then(() => {
    setupPnp();

    const container = document.getElementById("example-cewp-container");

    const rtfString = "{\\rtf1\\ansi\\deff0 hi \\b there\\b0  \\ul there \\ulnone\\i there is\\i0\\par }";
    rtfToHTML.fromString(rtfString, (err, html) => {
      console.log(html);

      // This works ok, prints a document containing:
      // <p>hi <strong>there</strong> <u>there </u><em>there</em></p>
    });

    rtfToHTML.fromStream(fs.createReadStream(`C:\qdr_template_en.rtf`), (err, html) => {      // <-----  Uncaught Error: Cannot find module 'fs'

      // rtfToHTML.fromStream(fs.createReadStream("http://sppp/sites/site/web/Shared%20Documents/qdr_template_en.rtf"), (err, html) => { // not sure if it works by url..
      console.log("html");
    });
  })
  .catch(logger.error);

index.ts:8 Uncaught Error: Cannot find module 'fs'
at webpackMissingModule (index.ts:8:20)
at ./src/scripts/index.ts (index.ts:8:20)
at webpack_require (bootstrap:19:1)
at 4 (app.js?v=1.0.0_1694106066194:22590:18)
at webpack_require (bootstrap:19:1)
at bootstrap:83:1
at bootstrap:83:1
webpackMissingModule @ index.ts:8
./src/scripts/index.ts @ index.ts:8
webpack_require @ bootstrap:19
4 @ app.js?v=1.0.0_1694106066194:22590
webpack_require @ bootstrap:19
(anonymous) @ bootstrap:83
(anonymous) @ bootstrap:83
client:52 [WDS] Live Reloading enabled.
client:150 [WDS] Errors while compiling. Reload prevented.
errors @ client:150
(anonymous) @ socket.js:47
sock.onmessage @ SockJSClient.js:67
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:885
SockJS._transportMessage @ sockjs.js:883
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2958
client:159 ./src/scripts/index.ts
Module not found: Error: Can't resolve 'fs' in 'C:_prj\html-to-rtf-test\src\scripts'
errors @ client:159
(anonymous) @ socket.js:47
sock.onmessage @ SockJSClient.js:67
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:885
SockJS._transportMessage @ sockjs.js:883
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2958
client:52 [WDS] Live Reloading enabled.
client:150 [WDS] Errors while compiling. Reload prevented.
errors @ client:150
(anonymous) @ socket.js:47
sock.onmessage @ SockJSClient.js:67
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:885
SockJS._transportMessage @ sockjs.js:883
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2958
client:159 ./src/scripts/index.ts
Module not found: Error: Can't resolve 'fs' in 'C:_prj\html-to-rtf-test\src\scripts'
errors @ client:159
(anonymous) @ socket.js:47
sock.onmessage @ SockJSClient.js:67
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:885
SockJS._transportMessage @ sockjs.js:883
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2958
client:55 [WDS] App updated. Recompiling...
client:55 [WDS] App updated. Recompiling...
client:55 [WDS] App updated. Recompiling...
client:55 [WDS] App updated. Recompiling...
client:150 [WDS] Errors while compiling. Reload prevented.
errors @ client:150
(anonymous) @ socket.js:47
sock.onmessage @ SockJSClient.js:67
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:885
SockJS._transportMessage @ sockjs.js:883
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2958
client:159 ./src/scripts/index.ts
Module not found: Error: Can't resolve 'fs' in 'C:_prj\html-to-rtf-test\src\scripts'
errors @ client:159
(anonymous) @ socket.js:47
sock.onmessage @ SockJSClient.js:67
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:885
SockJS._transportMessage @ sockjs.js:883
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2958
client:150 [WDS] Errors while compiling. Reload prevented.
errors @ client:150
(anonymous) @ socket.js:47
sock.onmessage @ SockJSClient.js:67
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:885
SockJS._transportMessage @ sockjs.js:883
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2958
client:159 ./src/scripts/index.ts
Module not found: Error: Can't resolve 'fs' in 'C:_prj\html-to-rtf-test\src\scripts'
errors @ client:159
(anonymous) @ socket.js:47
sock.onmessage @ SockJSClient.js:67
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:885
SockJS._transportMessage @ sockjs.js:883
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2958
client:150 [WDS] Errors while compiling. Reload prevented.
errors @ client:150
(anonymous) @ socket.js:47
sock.onmessage @ SockJSClient.js:67
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:885
SockJS._transportMessage @ sockjs.js:883
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2958
client:159 ./src/scripts/index.ts
Module not found: Error: Can't resolve 'fs' in 'C:_prj\html-to-rtf-test\src\scripts'
errors @ client:159
(anonymous) @ socket.js:47
sock.onmessage @ SockJSClient.js:67
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:885
SockJS._transportMessage @ sockjs.js:883
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2958
client:150 [WDS] Errors while compiling. Reload prevented.
errors @ client:150
(anonymous) @ socket.js:47
sock.onmessage @ SockJSClient.js:67
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:885
SockJS._transportMessage @ sockjs.js:883
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2958
client:159 ./src/scripts/index.ts
Module not found: Error: Can't resolve 'fs' in 'C:_prj\html-to-rtf-test\src\scripts'

Best regards, Gennady

[koltyakov]

Hi @Gennady-G,

fs module is the Node.js one (runs on a server, not in a browser).

When you bundle a solution for the frontend you can't use server side modules. That's why the error, as the generator's solutions is client side browser apps targeted.

[Gennady-G]

Arghh...
Thank You much Andrew!)
And also thank You much for sppp generator! :) 👍