After installing appx created with electron-builder setting default electron icon to my installed app

Question

While installing the appx now i am able to see logo on launcher/install popup screen. This worked when i made below changes:

1)Downgraded electron-builder version to: 20.39.0

2)Changed the directories entry in package.json as :

directories:{
"buildResources": "build",
"output": "build"}

3)Created appx named folder inside the build directory and created the build directory at package.json level

4)Added icon named "StoreLogo.png" inside build/appx directory that we have created earlier.

5)add the entry of the same in :

 "win": {
  "icon":"build/appx/StoreLogo.png"
}

6)After this just create the appx using electron-builder -w appx command

Now I have one more doubt after complete installation i am still seeing the default electron logo at the task-bar and also in the apps & features if i search for my application.

On the launcher/install popup i am able to see the app logo like below hidden with red color:

After installing and launching the app i am still able to see the default electron icon in the taskbar as below highlighted in red:

This is how my package.json build property looks:

  {
  "build": {
    "extraFiles": [
      "node_modules/ionic-enterprise-couchbase-lite-electron/**/*"
    ],
    "publish": [
      {
        "provider": "generic",
        "url": "***********"
      }
    ],
    "appId": "**************",
    "nsis": {
      "perMachine": true,
      "oneClick": false,
      "allowToChangeInstallationDirectory": true
    },
    "squirrelWindows": {},
    "files": [
      "electron.js",
      "www/**/*",
      "build/Square150x150Logo.png",
      "build/Square44x44Logo.png"
    ],
    "directories": {
      "buildResources": "build",
      "output": "build"
    },
    "appx": {
      "identityName": "myApp",
      "publisher": "CN=*************************",
      "publisherDisplayName": "my Company",
      "applicationId": "myApp",
      "displayName": "myApp",
      "backgroundColor": "#f2f4f7"
    },
      "win": {
      "certificateFile": "./certs/CordovaApp.Windows10_StoreKey.pfx",
      "publisherName": "my Company",
      "icon": "build/appx/StoreLogo.png",
      "target": [
        {
          "target": "nsis",
          "arch": [
            "ia32"
          ]
        },
        "appx",
        "msi"
      ]
    },
    "nodeGypRebuild": "false",
    "npmRebuild": "false"
  }
  }

I tried adding all related resources as mentioned in : https://www.electron.build/configuration/appx but it started giving error of invalid manifest when creating a appx.

So can anyone please help me to resolve this issue?

Neha Tawar Neha Tawar · Accepted Answer · 2019-05-20T13:59:01

I solved the issue by doing below changes:

1) Added the assets mentioned in the appx link: https://www.electron.build/configuration/appx

2) created appx folder in the build directory, keep the package.json as mentioned above.

3)Make sure the app logos named should be specific as metioned in the link .PNG format.

4)Earlier I had icon names as e.g: Square44x44Logo.png format .PNG then after changing the name to Square44x44Logo kept format .PNG as it is I was able to solve installed app issue.

What i realized by this is naming convention does matter a lot in case of applying icons. So the main issue caused due to pont 4.

After installing appx created with electron-builder setting default electron icon to my installed app

1 Answers