score:1

Accepted answer

if you are using material-ui v1 then you do not use the @types anymore the types are shipped with the package. simply point your tsconfig file to it in the "types": "material-ui" and have node_modules in the "typeroots" section.

example

"compileroptions": {
    "typeroots": [
       "node_modules/@types",
        "node_modules"
    ],
    "types": [
        "node", "jest", "lodash", "react",
        "react-dom", "react-redux", "redux-logger", "material-ui",
        "react-router-dom", "react-router-redux",
        "redux", "binary-type-tree", "redux-form",
        "tedb", "react-tap-event-plugin",
        "react-hot-loader", "material-ui-icons"
    ],
    "outdir": "dist"
},
"include": [
    "src",
    "node_modules/**/*.d.ts",
    "node_modules/@types/**/*.d.ts"
],

this of course will change your project, the project had almost a complete rewrite and i had to rework my project to use v1.

score:1

<muithemeprovider theme={theme}>

the type definition for mui is out of date / incorrect. this wouldn't be a problem if mui was written in typescript.

more

be the change and provide a fix here : https://github.com/definitelytyped/definitelytyped/blob/master/types/material-ui/index.d.ts as a pr.

prefer typescript first packages

e.g. blueprintjs as they do not suffer from such problems. more : https://basarat.gitbooks.io/typescript/content/docs/quick/nodejs.html

score:2

the answer by @blaine garrett is very good but i fixed the error by using

import { makestyles } from '@material-ui/core';

as using import { makestyles } from '@material-ui/core/styles'; was giving me another error.

score:2

this worked for me

import { makestyles } from "@material-ui/styles";

const usestyles = makestyles((theme: theme) => ({

}));

score:45

for anyone running into a similar error message in 2020, my issue was that i was importing makestyles from the @material-ui/styles package. switching to the preferred @material-ui/core/styles package gives you the correct types.

eg. change:

import { makestyles } from '@material-ui/styles';

to

import { makestyles } from '@material-ui/core/styles';

see this github issue discussing the preferred import. i believe the former was introduced with mui 3 as a temporary shim for some style conversions they were working on.


Related Query

More Query from same tag