[docs] Fix typechecking

[merceyz]

• I have followed (at least) the PR section of the contributing guide.

• Added @material-ui/styles alias to tsconfig.json as docs failed to find it and tslint silently ignored the issue
• Fixes incorrect typing for @material-ui/system/css

[eps1lon]

What does this accomplish? What files didn't we typecheck before?

[merceyz]

It checks all files, compared to what happens now.
I don't know exactly what was not getting tested but it's clear the *.d.ts files in material-ui-styles wasn't getting checked properly, as it contains invalid imports.

[eps1lon]

I don't know exactly what was not getting tested but it's clear the *.d.ts files in material-ui-styles wasn't getting checked properly, as it contains invalid imports.

yarn workspace @material-ui/styles typescript did run on those files. I don't think we need another task.

Could you explain why these are invalid imports? Our demos are relying on them so it seems like they're fine.

[merceyz]

Could you explain why these are invalid imports? Our demos are relying on them so it seems like they're fine.

If you check out this PR before I changed the imports and go to any of the demos and hover over the makeStyles function this is the result:

And classes:

From there go to the definition of makeStyles and scroll up to the imports, this is the result:

If you change the imports to be relative or add this to the root tsconfig.json it finds everything as it should

"@material-ui/styles": ["packages/material-ui-styles/src"],
"@material-ui/styles/*": ["packages/material-ui-styles/src/*"]

However, then you run into issues where createStyles isn't used, this issue is fixed in newer versions of TypeScript.
So the fix for these is either use createStyles, update typescript, or allow all properties to be strings

[eps1lon]

We can't verify if that isn't an issue with the editor. Those can e.g use different typescript versions.

Can you provide a clean repository that fails on a build step?

[merceyz]

We can't verify if that isn't an issue with the editor. Those can e.g use different typescript versions.

VSCode is set to use the same version as the repo uses (3.2.2)

Can you provide a clean repository that fails on a build step?

No, it works perfectly fine other projects. It's only from the docs folder it's having issues.

[merceyz]

@eps1lon Turns out tslint just ignored the import errors, I simplified this to just set the alias in docs/tsconfig.json

[mui-pr-bot]

No bundle size changes comparing e36d33a...960e17e

Generated by 🚫 dangerJS against 960e17e

[eps1lon]

Well I have no idea what happened but it seems like our docs never type-checked properly anything related to @material-ui/styles. I don't know where typescript pulled the declarations for @material-ui/styles from or why it didn't report implicit any.

[merceyz]

That's what I've been trying to get across xD

[eps1lon]

@merceyz Yeah I'm super grateful for this. I had a lot of assumptions about our demos that were basically not true. I'm still not sure why this happened but at least we know what's wrong now.

I think we should rather use

--- a/tsconfig.json
+++ b/tsconfig.json
@@ -17,6 +17,8 @@
       "@material-ui/core/*": ["./material-ui/src/*"],
       "@material-ui/lab": ["./material-ui-lab/src"],
       "@material-ui/lab/*": ["./material-ui-lab/src/*"],
+      "@material-ui/styles": ["./material-ui-styles/src"],
+      "@material-ui/styles/*": ["./material-ui-styles/src/*"],
       "@material-ui/system": ["./material-ui-system/src"]
     }
   },

on the root tsconfig and add the noUnusedLocals later.

[merceyz]

@eps1lon Agreed. Now the question is, what to do about the type inference issues, it's fixed in newer versions of typescript.

[merceyz]

The error at material-ui/docs/src/pages/system/basics/JSS.tsx:14:6 is fixed by #15548