How to Use Feather Icons on Laravel through Laravel Mix, NPM

Yes what you did is correct. Follow the steps for adding icon to your project.

Add feather.replace() method in same app.js file.
Link generated file to your layout or page it should be stored in public/js by default so the script tag is looks like (assuming you using it in Laravel Blade)

<script src="{{ asset('js/app.js') }}"></script>

Add desired icon to your markup

<h1><i data-feather="circle"></i>Hello World</h1>

it should work fine. alternatively you can use directly by linking to CDN.

<!DOCTYPE html>
<html lang="en">
  <title></title>
  <script src="https://unpkg.com/feather-icons"></script>
  <body>

    <!-- example icon -->
    <i data-feather="circle"></i>

    <script>
      feather.replace()
    </script>
  </body>
</html>

Tags:

Icons

Npm

Laravel Mix

Related