0

I am trying to use https://gcanti.github.io/fp-ts/modules/Option.ts.html as follows:

import O, {Option} from "fp-ts/Option";
....

useEffect(() => {

    if (error) {
        handleResultCategories(O.none);
        return;
    }
    handleResultCategories(O.some(selection));
}, [error, selection]); 
....

the compiler complains:

TypeError: Cannot read property 'some' of undefined
    at http://localhost:6006/main.22489267b0e89682c1e1.hot-update.js:130:82
    at invokePassiveEffectCreate

Changing to:

....
import {Option, some, none} from "fp-ts/Option";

useEffect(() => {

    if (error) {
        handleResultCategories(none);
        return;
    }
    handleResultCategories(some(selection));
}, [error, selection]);
....

it works. What is wrong with the first approach?

Ilario Pierbattista
  • 3,175
  • 2
  • 31
  • 41
softshipper
  • 32,463
  • 51
  • 192
  • 400
  • 3
    maybe there's no default export? – Ramesh Reddy Apr 13 '21 at 19:59
  • Indeed, no default export https://github.com/gcanti/fp-ts/blob/master/src/Option.ts – Nadia Chibrikova Apr 13 '21 at 20:04
  • Does this answer your question? [When should I use curly braces for ES6 import?](https://stackoverflow.com/questions/36795819/when-should-i-use-curly-braces-for-es6-import) – Brian Thompson Apr 13 '21 at 20:49
  • And as a quick supplement: A default import is not just an object containing all of the named exports. In order to use it that way, the package you're using has to have implemented it. It's not how it works by default. – Brian Thompson Apr 13 '21 at 20:52
  • 3
    You could however use this: `import * as O from 'p-ts/Option';` to accomplish that syntax. – Brian Thompson Apr 13 '21 at 20:54
  • 1
    Try enabling the `allowSyntheticDefaultImports` option in your `tsconfig`: https://www.typescriptlang.org/tsconfig#allowSyntheticDefaultImports – Linda Paiste Apr 14 '21 at 00:25

0 Answers0