Где ошибка в нижнем колонтитуле этого реактивного веб-приложения?

Когда я пытаюсь скомпилировать приложение локально, оно не запускается. Это должно быть действительно простая ошибка, но я не могу ее найти. Я тоже не опытный программист, поэтому ответ покажется очень очевидным. Спасибо за любую помощь!

Вот код:

import React from 'react';

import { Link } from 'react-router-dom';

import twitterIcon from './twitterIcon.svg';
import facebookIcon from './facebookIcon.svg';
import './Footer.css';

const Footer = () => (
  <div className = "Footer-wrapper">
    <div className = "Footer-text-links-wrapper">
      <Link to = "/about">
        <span className = "Footer-text-link">About</span>
      </Link>
      <Link to = "/faq">
        <span className = "Footer-text-link">FAQ</span>
      </Link>
      <Link to = "/contact">
        <span className = "Footer-text-link">Contact</span>
      </Link>
      <a href = "xxx"><span className = "Footer-text-link">Community</span></a>
    </div>
    // <div className = "Footer-icon-links-wrapper">
    //   <a
    //     href = "https://www.twitter.com"
    //     target = "_blank"
    //     rel = "noopener noreferrer"
    //   >
    //     <img src = {twitterIcon} className = "Footer-icon-link" alt = "twitter" />
    //   </a>
    //   <a
    //     href = "https://www.twitter.com"
    //     target = "_blank"
    //     rel = "noopener noreferrer"
    //   >
    //     <img src = {facebookIcon} className = "Footer-icon-link" alt = "facebook" />
    //   </a>
    //
    // </div>
  </div>
);

export default Footer;

Вот ошибка терминала:

Failed to compile.

./src/components/Footer/Footer.js
Syntax error: Unexpected token (40:2)

  38 |     //
  39 |     // </div>
> 40 |   </div>
     |   ^
  41 | );
  42 |
  43 | export default Footer;
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
0
0
81
2

Ответы 2

вы не можете размещать комментарии // в jsx. https://wesbos.com/react-jsx-comments/

Комментарии не могут быть похожи на //, как в Javascript внутри JSX. Чтобы писать комментарии, вы можете сделать что-то вроде этого: `{/ * ... comment * /}. Итак, в вашем коде это будет выглядеть примерно так

    </div>
{/* <div className = "Footer-icon-links-wrapper">
        ...
   </div> */}
  </div>

Другие вопросы по теме