Typescript Module Has No Exported Members - React

Typescript module has no exported members - react

Your code should work if you fix your typo.

Instead of

import { Nodelist } from "../components/NodeList"

you should write :

import { NodeList } from "../components/NodeList"
//           ^ capital L

Module '"react"' has no exported member 'SuspenseList'. TS2305

If anyone is still facing this issue Please install the latest version of @types/react
More info in the attached npm link
npm i @types/react

React-Typescript: Module '"react-router-dom"' has no exported member 'RouteComponentProps'

react-router v6 doesn't use RouteComponentProps anymore. Here are some links with examples on how to change route and how to use params on v6 with some links where you can find more informations:

For changing route (old history.push)

If you want to change the route after the login is successful react-router docs specify

In v6, this app should be rewritten to use the navigate API. Most of the time this means changing useHistory to useNavigate and changing the history.push or history.replace callsite.

So basically instead of this

...
function handleClick() {
  history.push("/home");
}
...

use something like:

// This is a React Router v6 app
import { useNavigate } from "react-router-dom";
function App() {
  let navigate = useNavigate();
  function handleClick() {
    navigate("/home");
  }
  ...

For link params

According to this link when you upgrate to React Router v6 you should just use import {useParams} from 'react-router-dom'; + const params = useParams(); so something like:

import React from 'react';
import {useParams} from 'react-router-dom';

const Component: React.FC = (): JSX.Element => {
  const params = useParams();
  return <>Link ID parameter === "{params.id}"</>;
}

---

Edit regarding types (for ts):
You can find more information about the interfaces here (for useNavigate) and here (for useParams)

What causes the typescript Module has no exported member .ts(2305) error and how do you fix it?

This is not a general error, it is a very specific one. This error tells you that you are trying to import something that doesn't exist.

And the answer for each depends on what you are importing.

• Routes is not a named export of react-router-dom. Nowhere in the documentation is the the characters <Routes. I dont know what you think you're importing, but you probably wanted something else.

• MaterialCommunityIcons is not a named export of react-native-vector-icons. According to the documentation you need to import that like this:

  import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons';
  

• useNavigate is not a named export of react-router. The documentation lists useNavigation. Did you mean to import that instead?

As you can see, there is not a one size fits all solution. You must consult the documentation and try to find what you want to import and ensure that you get the right thing.

Typescript/React: Module has no exported member

The issue for the missing member export was the fact that I had an intermediary index file which TypeScript doesn't seem to be able to use when exporting types:

// ./Component/index.tsx
export { Component, Props } from "./js/Component";

When I change the import to use an exact path to the file rather than trying to import it through the index file it picked it up:

// ./AnotherComponent/js/AnotherComponent.tsx
import { Props as ComponentProps} from "./Component/js/Component";

How to resolve the error: Module '"react-hook-form"' has no exported member 'useForm'

the typescript version you are using in your project could be the source of the error since react-hook-form said :

Important: Typescript ^4.3 above is the recommended version to work
with react hook form.
https://react-hook-form.com/ts/

here I tried your code and it is not showing that error
https://codesandbox.io/s/compassionate-sea-z5sx9u?file=/src/App.tsx

you can have a look at versions used in package.json
https://codesandbox.io/s/compassionate-sea-z5sx9u?file=/package.json

---

Related Topics