React-admin: Typescript Import Errors

Created on 8 Mar 2019  路  10Comments  路  Source: marmelab/react-admin

What you were expecting:
Expected that a Typescript based react-admin website that had no Typescript compile errors would continue to not have any compile errors when react-admin was updated from version 2.7.2 to 2.7.3.

What happened instead:
An import statement like:
import { Layout } from 'react-admin';

began displaying errors like:

Module '".../web/node_modules/react-admin/esm"' has no exported member 'Layout'.

Other information:
I believe this behavior was introduced in PR #2924 when the following change was made to the react-admin/package.json file:

"declaration": true,

Apparently, since the ra-ui-materialui package is not yet producing types, any types found in that package that are imported in Typescript cause errors.

Environment

  • React-admin version: 2.7.3
  • Last version that did not exhibit the issue (if applicable): 2.7.2
  • React version: 16.3.2
  • Browser: Chrome Version 72.0.3626.121
bug

Most helpful comment

Hi. Should this be set back to true again now that things the different packages are typescript?
https://github.com/marmelab/react-admin/blob/master/packages/react-admin/tsconfig.json#L6

Getting

Could not find a declaration file for module 'react-admin'. '/home/alexalvarez/dev/hasura-poc/react-admin/node_modules/react-admin/lib/index.js' implicitly has an 'any' type.
when doing

import { Admin, Resource, ListGuesser } from 'react-admin';

on v2.9.8

All 10 comments

Thanks, so we need to remove the declarations from the react-admin package until everything is typed...

Just tried version 2.8.0 and this bug still exists. I created a repository that demonstrates the issue. Apparently, since some the *.d.ts files exist the problem remains.

I noticed that #2984 is currently being worked. Is that slated for the next release or will that be a while yet?

No, #2984 will take weeks. We'll have to hotfix 2.8.0.

@mtakayuki I tested the #2988 patch in your repository, and there are no more compilation errors. Thanks a lot for taking the time to post the code demonstrating the issue!

as of 2.8.2 i'm still getting these errors

Did you wipe out the node_modules and reinstall? I used your repository and couldn't see the errors.

yes

node_modules/ra-core/esm/util/Query.d.ts:15:32 - error TS7016: Could not find a declaration file for module 'react-redux'. '/Users/bnaya/dev/brandtotal/backoffice-fullstack/node_modules/react-redux/lib/index.js' implicitly has an 'any' type.
  Try `npm install @types/react-redux` if it exists or add a new declaration (.d.ts) file containing `declare module 'react-redux';`

15 declare const _default: import("react-redux").ConnectedComponentClass<any, Pick<{}, never> & RawProps>;
                                  ~~~~~~~~~~~~~

node_modules/ra-core/esm/util/TestContext.d.ts:12:18 - error TS7016: Could not find a declaration file for module 'redux-form'. '/Users/bnaya/dev/brandtotal/backoffice-fullstack/node_modules/redux-form/lib/index.js' implicitly has an 'any' type.
  Try `npm install @types/redux-form` if it exists or add a new declaration (.d.ts) file containing `declare module 'redux-form';`

12     form: import("redux-form").FormStateMap;
                    ~~~~~~~~~~~~

node_modules/ra-core/esm/util/withDataProvider.d.ts:48:63 - error TS7016: Could not find a declaration file for module 'react-redux'. '/Users/bnaya/dev/brandtotal/backoffice-fullstack/node_modules/react-redux/lib/index.js' implicitly has an 'any' type.
  Try `npm install @types/react-redux` if it exists or add a new declaration (.d.ts) file containing `declare module 'react-redux';`

48 declare const withDataProvider: <T>(Component: any) => import("react-redux").ConnectedComponentClass<any, Pick<{}, never> & T>;
                                                                 ~~~~~~~~~~~~~

[1:05:19 PM] Found 23 errors. Watching for file changes.

And i'm not sure which repo you referring to,
the errors are on the consuming project

The immediate workaround is "skipLibCheck": true,

But better to fix the lib :)

Hi. Should this be set back to true again now that things the different packages are typescript?
https://github.com/marmelab/react-admin/blob/master/packages/react-admin/tsconfig.json#L6

Getting

Could not find a declaration file for module 'react-admin'. '/home/alexalvarez/dev/hasura-poc/react-admin/node_modules/react-admin/lib/index.js' implicitly has an 'any' type.
when doing

import { Admin, Resource, ListGuesser } from 'react-admin';

on v2.9.8

The react-admin package doesn't export types at the moment. You'll need to add a react-admin.d.ts file with the following content to use it in a Typescript project:

declare module 'react-admin';

Discussion regarding TS has moved to https://github.com/marmelab/react-admin/issues/1617#issuecomment-595874113

Was this page helpful?
0 / 5 - 0 ratings