Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

createUseStyles typescript declaration missing #1132

Closed
robcmills opened this issue Jun 14, 2019 · 9 comments · Fixed by #1155
Closed

createUseStyles typescript declaration missing #1132

robcmills opened this issue Jun 14, 2019 · 9 comments · Fixed by #1155
Labels
enhancement No kittens die if we don't do that. typescript

Comments

@robcmills
Copy link

robcmills commented Jun 14, 2019

Steps to reproduce:

  1. Create a fresh react app
  • npx create-react-app use-styles-ts
  • cd use-styles-ts
  1. Add react-jss and typescript
  • yarn add react-jss@next typescript
  • yarn add -D @types/react
  1. Rename App.js -> App.tsx and implement a simple usage of createUseStyles hook
import React from 'react';
import { createUseStyles } from 'react-jss';

const useStyles = createUseStyles({
  App: { textAlign: 'center' },
})

function App() {
  const classes = useStyles();
  return (
    <div className={classes.App}>
    ...
  1. Start app
  • yarn start

Expected behavior:

  • App compiles and runs normally

Describe the bug:

  • App fails to compile with error:
Failed to compile.

/Users/robcmills/src/jss-use-styles/src/App.tsx
TypeScript error in /Users/robcmills/src/jss-use-styles/src/App.tsx(2,10):
Module '"../../../../../Users/robcmills/src/jss-use-styles/node_modules/react-jss/src"' has no exported member 'createUseStyles'.  TS2305

    1 | import React from 'react';
  > 2 | import { createUseStyles } from 'react-jss';
      |          ^
    3 | import logo from './logo.svg';
    4 | import './App.css';
  • Apparently a typescript declaration for createUseStyles is missing from react-jss/src/index.d.ts
  • I have confirmed that adding a declaration for createUseStyles to this file silences the error

Versions:

  • react-jss: 10.0.0-alpha.17
  • typescript: 3.5.2
  • Browser [e.g. chrome, safari]: Chrome Version 74.0.3729.131 (Official Build) (64-bit)
  • OS [e.g. Windows, macOS]: macOS Sierra version 10.12.6
@kof kof added typescript bug It went crazy and killed everyone. labels Jun 14, 2019
@robcmills
Copy link
Author

@kof

Looks like this is already accomplished in @HenriBeck 's udpate-ts-typings branch:
a9881d9

Just needs to be PR'd and merged?

@HenriBeck
Copy link
Member

I started already with the typings. I will finish them today

@HenriBeck
Copy link
Member

I want to do some more testing tomorrow, and then we will release a new version.

@kof kof added defect Works as expected, but still wrong. enhancement No kittens die if we don't do that. and removed bug It went crazy and killed everyone. defect Works as expected, but still wrong. labels Jun 21, 2019
@HenriBeck
Copy link
Member

Sorry, had a few busy weeks with work and university. Finally got to check the typing and they look good.

I also started on adding proper type completion for the style object, but it's not correctly inferred at the moment.

@Dar0n
Copy link

Dar0n commented Jul 23, 2019

@HenriBeck Hi there! May I wonder why this was closed? The types seem to still be missing, for createUseStyles anyways.
I guess, it is not entirely relevant, since I've found out there is a v.10 release of react-jss and documentation I was reffering to was issued for this new version, which is not part of npm package(v8.6.1).
Could you clarify what's the state of new version and if there are any working typescript examples for current version 8.6.1?

@Kudze
Copy link

Kudze commented Jul 24, 2019

Having the same issue, just wondering why the issue has been closed.

@HenriBeck
Copy link
Member

@Dar0n there should be @types/react-jss version which is for v8 of react-jss.

@Kudze can you provide an example then maybe? It works for me. You also need to be on the latest v10 alpha for it to work.

@stewartduffy
Copy link

Any update on this?

@just-Bri
Copy link

@stewartduffy I know this is now closed but I am having a similar issue: #1344

React, using Material-UI via @material-ui/core/styles I'm getting all kinds of type errors when trying to define styles.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement No kittens die if we don't do that. typescript
Projects
None yet
Development

Successfully merging a pull request may close this issue.

7 participants