Attempted import error: 'FaPencil' is not exported from 'react-icons/fa'

Question

I am new to ReactJS, now i want to include ( React-icons ) in my project but it give me error. could you please help me .

Error : Attempted import error: 'FaPencil' is not exported from 'react-icons/fa'

Code is below

import React, { Component } from "react";
import { FaPencil } from "react-icons/fa";
import { FaTrash } from "react-icons/lib/fa/trash";

export default class Note extends Component {
  render() {
    return (
      <div className="note">
        <p>Learn React</p>
        <span>
          <button onClick={this.edit} id="edit">
            <FaPencil />
          </button>
          <button onClick={this.remove} id="remove">
            <FaTrash />
          </button>
        </span>
      </div>
    );
  }
}

Solution

import FaPencil from 'react-icons/lib/fa/pencil'

You don't need to destructure since you're pointing directly to the file. Using react-icons it's helpful to go to the node_modules folder to see where icons live.

Comments

[NanoNova]

or import { FaPencil } from 'react-icons/fa