Could not find a declaration file for module '@material-ui/styles/withStyles'.

Importing withStyles from @material-ui/styles/withStyles is returning a typescript error.

• This is not a v0.x issue.
• I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior 🤔

No typescript error

Current Behavior 😯

 Could not find a declaration file for module '@material-ui/styles/withStyles'. '/Users/vlanglet/Project/cloud/front/node_modules/@material-ui/styles/withStyles.js' implicitly has an 'any' type.
  Try `npm install @types/material-ui__styles` if it exists or add a new declaration (.d.ts) file containing `declare module '@material-ui/styles/withStyles';`

5 import withStyles, { StyleRules, WithStyles } from '@material-ui/styles/withStyles';

Steps to Reproduce 🕹

import withStyles, { StyleRules, WithStyles } from '@material-ui/styles/withStyles';

Context 🔦

The following lines return no error but I was expected to import everything from @material-ui/styles/withStyles

import { withStyles } from '@material-ui/styles';
import { StyleRules, WithStyles } from '@material-ui/styles/withStyles';

I assume it’s the same problem for others modules.

Your Environment 🌎

Tech	Version
Material-UI	v3.9.1
TypeScript	v3.2.2

[eps1lon]

I understand what’s happening now. We’re declaring the @material-ui/styles/withStyles module in @material-ui/styles/index.d.ts. But if you only ever import from @material-ui/styles/* typescript never touches the index.d.ts where the modules are declared.

In a perfect world typescript would fallback to index.d.ts but I understand that this is very opinionated about how typescript acquires types. This is also potentially an issue for us if we ever want to flatten the module declarations in @material-ui/core.

I would recommend you use named imports from the index. If you’re concerned with bundle size then you should fix this in your bundler. @material-ui/styles is “tree-shake-viable”.

If this is not possible you force typescript to read the index.d.ts by simply importing a type e.g. import { WithStyles } from "@material-ui/styles"; This will never affect your bundle size.

I tried adding node_modules/@material-ui/styles to the typeRoots but then typescript complains because the nested node_modules contains no type declarations.

Personally I wouldn’t use path imports and just use named imports. Especially since it prevents you from using private members such as StylesRules

[eps1lon]

@VincentLanglet Could you try adding "types": ["@material-ui/styles"] to compilerOptions in your tsconfig? This solved this issue for me. It might however hurt with other type aquisitions.