Skip to content

How to import specific component from react-bootstrap with Typescript #13

Open
@iamsaksham

Description

@iamsaksham

Earlier my app was in ReactJs + React-bootstrap. Now I'm using Typescript + ReactJs + React-bootstrap

To reduce the size of the app for production Earlier I used to import react-bootstrap components using - import Button from 'react-bootstrap/lib/Button'

After adding Typescript it shows the following error

ERROR in [at-loader] ./components/Hello.tsx:6:8
TS1192: Module ''react-bootstrap/lib/Button'' has no default export.

Attempt 1

import {Button} from 'react-bootstrap/lib/Button' but in this case Button is undefined.

Attempt 2

import * as Button from 'react-bootstrap/lib/Button' but in this case another error pops out

ERROR in [at-loader] ./components/Hello.tsx:54:12
TS2604: JSX element type 'Button' does not have any construct or call signatures.

This error shows error in line <Button bsStyle="danger" bsClass="glyphicon glyphicon-new-window"></Button>

Though import {Button} from 'react-bootstrap' works fine but this is not desired because it results in increasing the size of the app by 200kbs for me.

How can we import specific component from react-bootstrap using Typescript??

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions