greenlet
greenlet copied to clipboard
_ref not defined in Create react app.
We are planning to use greenlet to defer expensive computations to web worker in CRA project ( along with Type script ). To test it out I was playing around with a small example.
greenlet-helpers.ts
import greenlet from 'greenlet';
export const greenletRead = greenlet(async msg => {
return msg;
});
utils.ts
import { greenletRead } from './greenlet-helpers';
try {
const resp = await greenletRead('Hey from greenlet');
console.log(resp);
} catch (e) {
console.log('Exception', e);
}
Running into _ref is not defined when ever this gets invoked. It would be great if I can get any pointers to get this started.
P.S. I also tried moving the code snippet from greenlet-helpers to uitils and still running into the same issue.
utils.ts
import greenlet from 'greenlet';
try {
const greenletRead = greenlet(async msg => {
return msg;
});
const resp = await greenletRead('Hey from greenlet');
console.log(resp);
} catch (e) {
console.log('Exception', e);
}
Same issue here with CRA
Hi there - your async function is being transpiled to use helper methods, rather than being an actual async function. If you want to use an async function with Greenlet, you need to tell TypeScript and/or Babel to preserve async functions. In tsconfig.json:
{
"compilerOptions": {
"target": "ES2015"
}
}
For those interested, you can easily check to see what a function "looks like" when it gets compiled by your build system:
const myFunction = async msg => {
return msg;
};
console.log('' + myFunction);
If you run the above in a stock CRA setup, you'll notice the compiled code contains a bunch of references to external variables that Greenlet isn't aware of.
If the tsconfig option doesn't work for folks (perhaps you're still required to support IE11), you can either remove the async/await, or use a String:
// Option 1: use a non-async function
const greenletRead = greenlet(msg => {
// you can optionally use promises here instead of async/await
return msg;
})
// Option 2: use a string
const greenletRead = greenlet(`async function(msg) {
return msg;
}`)
await greenletRead('Hey from greenlet');
I tried option one and am receiving a new error uncaught exception: ReferenceError: promise_default is not defined:
const greenletRead = greenlet(msg => {
return new Promise((resolve, reject) => {
return resolve(msg)
})
})
I'm curious if you have a working example? I need to support IE11.
It works for me with return Promise.resolve(msg), though I'm using Storybook, not CRA.