I'm having an issue with React & TypeScript where a ponent loads for a brief second, then immediately fails with the error:

[internal] TypeScript error in [internal] (undefined,undefined): badly attached item found. TSINTERNAL_ERROR

The affected code:

App.tsx:

import React, {useState, useMemo} from "react";

import MainMenu from "./MainMenu";
import Lobby from "./Lobby";

interface appComponentsInterface {
    [key: string]: React.FC
}

const APP_COMPONENTS: appComponentsInterface = {
    "MainMenu": MainMenu,
    "Lobby": Lobby
}

export default () => {
    const [appState, setAppState] = useState("MainMenu");
    const AppComponent = useMemo(() => APP_COMPONENTS[appState], [appState]);

    return (
        <AppComponent />
    )
}

MainMenu.tsx:

import React from "react";

const MainMenu : React.FC = () => {
    return (
        <div> MainMenu </div>
    )
}

export default MainMenu;

Any advice would be appreciated - The error itself isn't too helpful.

I'm having an issue with React & TypeScript where a ponent loads for a brief second, then immediately fails with the error:

[internal] TypeScript error in [internal] (undefined,undefined): badly attached item found. TSINTERNAL_ERROR

The affected code:

App.tsx:

import React, {useState, useMemo} from "react";

import MainMenu from "./MainMenu";
import Lobby from "./Lobby";

interface appComponentsInterface {
    [key: string]: React.FC
}

const APP_COMPONENTS: appComponentsInterface = {
    "MainMenu": MainMenu,
    "Lobby": Lobby
}

export default () => {
    const [appState, setAppState] = useState("MainMenu");
    const AppComponent = useMemo(() => APP_COMPONENTS[appState], [appState]);

    return (
        <AppComponent />
    )
}

MainMenu.tsx:

import React from "react";

const MainMenu : React.FC = () => {
    return (
        <div> MainMenu </div>
    )
}

export default MainMenu;

Any advice would be appreciated - The error itself isn't too helpful.

• javascript
• reactjs
• typescript

• Try removing node_modules, lock files and reinstall. Make sure to use only yarn or npm, not both. – Phix Commented May 21, 2020 at 17:47
• @Phix Thank you, that worked perfectly. – user13380302 Commented May 21, 2020 at 18:03
• 1 just rebuilding the app was enough for me – Andy Commented Jul 28, 2020 at 10:12

1 Answer 1

I have faced the same issue.
You probably installed nom modules and did not restart the dev server.

After installing any packages, try to restart the server(npm/yarn start)