FontAwesomeIcon "определен, но никогда не используется", даже если это требуется - PullRequest
0 голосов
/ 02 октября 2018

Недавно я добавил FontAwesomeReact на свой сайт React.Я использую значки в компоненте боковой панели, который отображается на каждой странице.

Страница:

import React from 'react'
import Header from '../components/header'
import Sidebar from '../components/sidebar'
import Layout from '../components/layout'
import Footer from '../components/footer'

class IndexPage extends React.Component {
    render() {
        return (
            <Header />
            <Sidebar />
            <Layout>
                <p>Hello there is some content here </p>
            </Layout>
            <Footer />
        )
    }
}

Компонент боковой панели:

import React from 'react'
import Menucard from '../components/menucard'
import { library } from '@fortawesome/fontawesome-svg-core'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faInfoCircle, /*...*/, faCheck} from '@fortawesome/free-solid-svg-icons'
library.add(faInfoCircle,/*...*/,faCheck)

const clubAdminMenu = (
  <div>
    <h2>Club Admin</h2>
    <ul>
      <li className="pod">
        <a href="..."><FontAwesomeIcon icon="user" pull="right" /> Manage Registrations</a>
      </li>
      <li className="pod">
        <a href="..."><FontAwesomeIcon ... /> ...<a>
      </li>
      ...
    </ul>
  </div>
)


class Sidebar extends React.Component {
render() {
    return (
      <div className="Sidebar">
        <Menucard content={clubAdminMenu} />
        ...
      </div>
    )
  }
}

export default Sidebar
  • СначалаЯ предполагал, что <FontAwesomeIcon /> будет определен везде, поскольку он импортируется в <Sidebar />, а <Sidebar /> находится на каждой странице.Очевидно, я был неправ, значки не отображались ни на одной странице, если я явно не включил import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' на каждой странице.
  • Но когда я включаю это import на каждую страницу, компилятор предупреждает меня, что 'FontAwesomeIcon' is defined but never used примерно миллион раз (один раз на каждой странице, которая не включает <FontAwesomeIcon /> в своем теле, даже если она включена в <Sidebar />), я понимаю, почему это говорится, но если я удаляю импорт, значки делаютне отображать в боковой панели на этой странице.

Эти две вещи, кажется, противоречат друг другу.Я что-то пропустил?Есть ли лучший способ сделать это?

1 Ответ

0 голосов
/ 02 октября 2018

Когда вы импортируете

 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'

Вам нужно позвонить

  <FontAwesomeIcon />

Причина, по которой вы получаете это сообщение, потому что вы просто импортируете его, но никогда не вызывали.Так что сделайте, как я предложил выше

...