List missing from reactstrap

Question

I'm trying to add a footer to a webpage. It looks like this:

import React from 'react';
import { Row, Col, List, ListInlineItem } from 'reactstrap'
import { HashLink } from 'react-router-hash-link';
import { Link } from 'react-router-dom';

import logo from './../assets/logo.png'

export function Footer(props) {

  return (
    <div>
      <hr />
      <Row>
        <Col xl="2" lg="2" className="d-none d-lg-block">
          <img src={logo} className="img-side" alt="Loading..." />
        </Col>
        <Col xl="8" lg="8" md="12" sm="12" xs="12">
          <center>
            <small>
              <p><a href="">Privacy Policy</a></p>
              <List type="inline">
                <ListInlineItem>
                  <Link to="/">Home</Link>
                </ListInlineItem>
                <ListInlineItem>
                  <HashLink to="/#product">Product</HashLink>
                </ListInlineItem>
                <ListInlineItem>
                  <Link to="/overview">Solution</Link>
                </ListInlineItem>
                <ListInlineItem>
                  <HashLink to="/#getintouch">Contact Us</HashLink>
                </ListInlineItem>
              </List>
              <p><a href="">Subscribe to Newsletter</a></p>
            </small>
          </center>
        </Col>
      </Row>
    </div>
  );
}

When I try to stand this page up, I get the following error:

Attempted import error: 'List' is not exported from 'reactstrap'.

I'm not sure what's causing this because List is documented on the Reactstrap website, here. I've also looked at this question for a resolution, but as I'm using bracketed imports, this didn't really help me. I also tried following the guide here but that didn't help either. For reference, I'm using reactstrap 8.4.1, according to the npm list reactstrap command. What am I doing wrong here?

Answer 1

In my case, this works.

npm install --save reactstrap
npm audit fix --force