Ошибка сборки модуля: SyntaxError: Неожиданный токен (10: 0) при добавлении CSS в файл .css

Question

Я добавил следующий код в файл .css, связанный с компонентом React.

.navbar-brand {
color: #333;
}

a {
color: #333;
font-weight: 200;
}

Это операторы импорта в моем файле .jsx:

import React,{ Component } from 'react';
import { Link } from 'react-router-dom';
import './Navbar.css';


class Navbar extends Component {
render() {
    return (

        <nav className="navbar navbar-expand-md">
            <button className="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
                <span className="navbar-toggler-icon"></span>
            </button>
            <div className="container">

            <div className="collapse navbar-collapse" id="navbarCollapse">
                <ul className="navbar-nav ml-auto">
                <li className="nav-item active">
                    <Link className="nav-link" to="/">Home <span className="sr-only">(current)</span></Link>
                </li>
                <li className="nav-item">
                    <Link className="nav-link" to="/">Link</Link>
                </li>
                <li className="nav-item">
                    <Link className="nav-link" to="/about">About</Link>
                </li>
                </ul>
              </div>
            </div>
        </nav>


    );
  }
}

export default Navbar;

Это как-то связано с путем файла .css?Любая помощь будет оценена.Это ошибка, которую он выдает мне в консоли.

ERROR in ./src/components/Navbar.css
Module build failed: SyntaxError: Unexpected token (10:0)

 8 |     font-weight: 200;
 9 | } */
 > 10 | .navbar-brand {
 | ^
 11 |     color: #333;
 12 | }