how to change the defaut menu icon to image icon in ionic

Question

I'm trying to replace the menu icon to image icon in ionic application. I have a menu.html as follows:

<ion-side-menus>
<ion-side-menu-content>
<ion-nav-bar class="bar-dark nav-title-slide-ios7">
</ion-nav-bar>
<ion-nav-view name="menuContent" animation="slide-left-right"></ion-nav-view>
 </ion-side-menu-content>

<ion-side-menu side="left">
<header class="bar bar-header bar-dark">
 </header>
  <ion-content class="has-header">
  <ion-list>
    <ion-item menu-close ui-sref="app.home">
      Home
    </ion-item>
    <ion-item menu-close ui-sref="app.profile">
      Update Profile
    </ion-item>
    <ion-item menu-close ui-sref="app.project">
     Add Project
    </ion-item>

    <ion-item menu-close ng-click="logout();">
      Log Out
    </ion-item>
  </ion-list>
</ion-content>
</ion-side-menu>
</ion-side-menus>

But I don't know how to replace the menu icon with image icon. can you please help

this is home.html:

 <ion-nav-buttons side="left">
 <button menu-toggle="left" class="button button-icon icon ion-navicon"></button>
 </ion-nav-buttons>
 <icon-view>
 <ion-pane>
 <ion-content>
 </ion-content>
 </ion-pane>
 </icon-view>

Answer 1

As of Ionic 5, you can just add any other ion-icon inside of the ion-menu-button like this:

<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-menu-button>
        <ion-icon color="success" name="close"></ion-icon> // <--- here
      </ion-menu-button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

And in the same way, you can also use a custom SVG icon:

<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-menu-button>
        <ion-icon 
          color="success" 
          src="assets/my-icons/custom-menu.svg" // <--- like this
        ></ion-icon>
      </ion-menu-button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>