Wednesday, 4 August 2021

Svelte giving me 'Uncaught ReferenceError: require is not defined'

I'm trying to use a natural language generation library called RosaeNLG with my Svelte app but whenever I import any variable from the JavaScript file that 'requires' rosaenlg I get an error saying 'Uncaught ReferenceError: require is not defined'.

Rosae is a library for node.js or client side (browser) execution, based on the Pug template engine.

I have read similar issues with Svelte that have been solved by changing the 'requires' syntax to different forms of 'import'. For instance: 'import rosaenlgPug from "rosaenlg"'; 'import * as rosaenlgPug from "rosaenlg"'; var rosaenlgPug = import("rosaenlg")'; 'import("rosaenlg")'.

All of these variations fail to rollup and eventually give the error: 'FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory'.

Edit: I have managed to get an old version of Rosae working within a svelte file using the following code:

<script>
let rendered = "Busy...";

const onRosaeNlgLoad = () => {

    let array = ['x','y','z'];
    
    let template = `
mixin variable
  | this is a Rosae template #[+syn('synonym1', 'synonym2')]`
    
    rendered = rosaenlg_en_US.render(template, {
        language: 'en_US',
        fruits: fruits
    })
}
</script>

<svelte:head>
    <script src="https://unpkg.com/rosaenlg@1.20.2/dist/rollup/rosaenlg_tiny_en_US_1.20.2_comp.js" on:load="{onRosaeNlgLoad}"></script>
</svelte:head>

<h1>{rendered}!</h1>

However, I still haven't been able to get it working in a JS file or by linking the template from a pug file, as instructed in the Rosae examples.

I'm trying the following in a JS file:

import * as rosaenlgPug from "rosaenlg";

let array = ['x', 'y', 'z']

let result = rosaenlgPug.renderFile('tuto.pug', {
    language: 'en_US',
    element: array[0]
});
 
export { result };

But when import the 'result' variable into a svelte file I get: 'Uncaught ReferenceError: require$$0$6 is not defined'.

Any suggestions about how to render a library like this in Svelte would be hugely appreciated. Thanks a lot.



from Svelte giving me 'Uncaught ReferenceError: require is not defined'

No comments:

Post a Comment