javascript - Typescript-modul har inga exporterade medlemmar - react

Jag arbetar med en React-, Redux- och TypeScript-applikation. Jag har en konstig situation där efter vissa ändringar har en av modulerna slutat exportera sina medlemmar.

Mappstrukturen är:

src
|---- components
|---- containers

Mappen 'components' har .tsx-filerna medan de omslutande .ts-filerna finns i mappen 'containers'.

Modulen NodeList.tsx listas nedan:

import * as React from "react";

export const NodeList = (props) => (
    <div id="NodeList">
        <ul>
        {props.items.map((item, i) => (
            <li key={i} >
                <span id={"Item_"+i}>{item}</span>
            </li>
            )
        )}
        </ul>
    </div>
    )

Den omslutande behållaren NodeListContainer är:

import { connect } from "react-redux";
import { Provider } from "react-redux";

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

const nodesAsArrayOfType = (state, nodeType: string) => {
    console.log("Going for nodes of type ", nodeType)
    let a = state.data.model.nodes
    let k = Object.keys(a);
    let sub = k.filter((e) => {
                   return a[e].nodeType == nodeType
        }).map((e) => a[e])
    console.log("Got nodes ", sub)    
    return sub
}

const mapStateToProps = (state) => {
    var list = nodesAsArrayOfType(state, state.UIstate.focusNodeType).map((e) => {return JSON.stringify(e)})
    console.log("Returning ", list, list.length)
    return {
        items: list
    }
}

const mapDispatchToProps = (dispatch) => {
    return {
        newTextValue: (e) => {dispatch({type: "ON_CHANGE", text: e.target.value})}
    }
}

export const NodeListContainer = connect(
    mapStateToProps,
    mapDispatchToProps
    )(NodeList)

Importen av NodeList ovan markeras med felmeddelandet

ERROR in ./src/containers/NodeListContainer.ts
(4,10): error TS2305: Module '"MyProject/src/components/NodeList"' has no exported member 'Nodelist'.

Kan någon ge någon inblick i vad som kan ha hänt här?

Svar #1

Din kod borde fungera om du rättar ditt stavfel.

Istället för

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

du bör skriva :

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

Svar #2

Om någon fortfarande har detta problem, upptäckte jag att jag bara exporterade en sak från filen så att ändra

export default function App() {
   ...
};

till

export function App() {
   ...
}

verkar ha gjort susen!

Relaterade artiklar