Redux-persist: PersistGate SyntaxError: Unexpected token import

[jrmdayn]

When following https://github.com/rt2zz/redux-persist/blob/master/docs/PersistGate.md doc to integrate with react, I get the following error when running test with react-scripts:

/node_modules/redux-persist/es/integration/react.js:9
    import React, { PureComponent } from 'react'; // eslint-disable-line import/no-unresolved
    ^^^^^^

   SyntaxError: Unexpected token import

     at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/ScriptTransformer.js:289:17)
      at Object.<anonymous> (src/containers/root.js:1:275)
      at Object.<anonymous> (src/containers/index.js:1:177)

instead of importing from es folder, if I import from lib folder, it works:

import { PersistGate } from 'redux-persist/lib/integration/react';

Is it what you recommend doing?

[rt2zz]

right, so es folder means es modules build meaning you need the necessary transforms to make that work. Webpack likely handles that for you during bundling, but not so during tests.

I would say your best bet is just to use lib, the alternative is to use a es modules transform against all node modules.

[jrmdayn]

Ok, thanks for that. Might be worth adding a line on the PersistGate doc as other users may have the same issue..

[ahmad2smile]

I had the same issue. Got a bit hacky solution, recommended by official jest docs here

[rt2zz]

the docs now use lib everywhere 👍