Search code examples
javascriptnode.jswebpackbabeljsbabel-loader

Webpack: Cannot destructure property `curry` of 'undefined' or 'null'

After compiling my application using webpack & babel-loader for the browser, the following error appears right off the bat before the main function starts:

Uncaught TypeError: Cannot destructure property `curry` of 'undefined' or 'null'.
    at Object../node_modules/@qzdio/f/lib/combinators/sync.js (index-c1596672f4.js:formatted:268)
    at n (runtime-74c3f0da77.js:formatted:10)
    at Object../node_modules/@qzdio/f/lib/combinators/index.js (index-c1596672f4.js:formatted:251)
    at n (runtime-74c3f0da77.js:formatted:10)
    at Object../node_modules/@qzdio/f/lib/index.js (index-c1596672f4.js:formatted:723)
    at n (runtime-74c3f0da77.js:formatted:10)
    at Object../dist/graph/visualizer/src/index.js (index-c1596672f4.js:formatted:9)
    at n (runtime-74c3f0da77.js:formatted:10)
    at window.webpackJsonp (runtime-74c3f0da77.js:formatted:26)
    at index-c1596672f4.js:formatted:1

The faulty code is the ES5 transpilation of the following: 

import R from 'ramda';
const { curry } = R;

// I :: a -> a
const I = (x) => x;
...

Where the said code is from a private functional library that relies on ramda and bluebird. The library is used and working under Node.js 8.9.1.

The webpack config used is straight up from philipwalton's webpack-esnext-boilerplate (great to start with :D)

Versions:

  • babel-cli: ^6.26.0,
  • babel-loader: ^7.1.2,
  • webpack: ^3.8.1,
  • Browser: Google Chrome Version 62.0.3202.89 (Official Build) (64-bit),
  • Node.js: 8.9.1,
  • npm: 5.5.1

What is the source of the error and how can it be resolved?

Cheers ✨

Solution

  • You have to use import { curry } from 'ramda'. You can see here how rambda is exporting it's modules. It doesn't export the ramda module itself, but rather the individual functions.

    If you want to access additional methods, you can use this for example:

    import { curry, addIndex, clone } from 'ramda'