vue electron name and icon

To set the name and icon for a Vue Electron application, follow these steps:

  1. First, locate the package.json file in your project directory. This file contains information about your application.
  2. Inside the package.json file, you will find a section called "build". If this section doesn't exist, you can create it.
  3. Within the "build" section, add a property called "productName" and set its value to the desired name of your application.
  4. Next, add a property called "appId". The value of this property should be a unique identifier for your application. It can be any string, but it is recommended to use a reverse domain notation (e.g., com.example.myapp).
  5. To set the icon for your application, create a folder called "build" in the root directory of your project, if it doesn't already exist.
  6. Inside the "build" folder, create another folder called "icons".
  7. Place your application icon file in the "icons" folder. The icon file should be in .ico format for Windows and .icns format for macOS. It is recommended to provide multiple sizes of the icon for better compatibility.
  8. Finally, update the "build" section in the package.json file with the path to your application icon file. Add a property called "icon" and set its value to the relative path of your icon file, starting from the root of your project.

That's it! After following these steps, your Vue Electron application should have a custom name and icon.