Fontawesome не работал в моем приложении реагировать

Question

Я установил font-awesome через npm.

"dependencies": {
        "@fortawesome/fontawesome-svg-core": "^1.2.15",
        "@fortawesome/free-solid-svg-icons": "^5.7.2",
        "@fortawesome/react-fontawesome": "^0.1.4",
        "axios": "^0.18.0",
        "jquery": "^3.3.1",
        "react": "^16.8.2",
        "react-dom": "^16.8.2",
        "react-scripts": "2.1.5"
    },

Но как я могу использовать значок в моем приложении.

<i className="fas fa-home" ></i>
                        <b> Trang chủ </b>

, но он не работал.

Answer 1

Из документации похоже, что сначала вам нужно импортировать каждый значок, который вы хотите использовать, и зарегистрировать его в библиотеке Font Awesome.Затем, если вы хотите использовать значок, импортируйте FontAwesomeIcon в качестве компонента React, а затем визуализируйте его как таковой.

Например:

В App.js:

import { library } from '@fortawesome/fontawesome-svg-core'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faHome } from '@fortawesome/free-solid-svg-icons'

library.add(faHome)

Тогда в вашем файле компонента:

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

export default props => {
    return (
        <span>
            <FontAwesomeIcon icon="home"/>
            <b>Trang chu</b>
        </span>
    )
}