У меня проблемы с моим компонентом, применяющим загрузочные классы NavBar и NavIcon

Question

Это мой первый раз, когда я использую bootstrap с реагировать, и он не применяет размеры к моему Navbar и значку Navbar. Я установил зависимости и использовал className вместо class и все еще не влиял.

import React, { Component } from "react";
import { Link } from "react-router-dom";
import logo from "../logo.svg";
import 'bootstrap/dist/css/bootstrap.min.css';


export default class Navbar extends Component {
    render() {
      return (
        <nav className="navbar navbar-expand-sm  bg-primary navbar-dark px-sm-5">
          {/* 
  https://www.iconfinder.com/icons/1243689/call_phone_icon
  Creative Commons (Attribution 3.0 Unported);
  https://www.iconfinder.com/Makoto_msk */}
          <Link to="/">
            <img 
            src={logo} 
            alt="store" 
            className="navbar-brand"/>
          </Link>

          <ul className=" navbar-nav align-items-center">
            <li className="nav-item ml-5">
            <Link to="/" className="nav-link">
            Products
            </Link>
            </li> 
          </ul>
        </nav>
      );
    }
  }

NavBar toбыть создан и не огромный логотип и огромный бар.

Answer 1

Вы уверены, что вы добавили bootstrap.css в документ?Вот рабочий пример того же кода https://codesandbox.io/s/0c9iz