Generate Assets

Assets Source

In created project there is an assets-src directory. It contains required icons and splash screens source images.

Based on created project configration, assets-src can contain the following files:

  • cordova-splash-screen.png - cordova app splash screen image. Appears if your project targets iOS or Android mobile app
  • cordova-ios-icon.png - cordova iOS app icon. Appears if your project targets iOS mobile app
  • cordova-android-icon.png - cordova Android app icon. Appears if your project targets Android mobile app
  • cordova-electron-app-icon.png - cordova Electron app icon. Appears if your project targets desktop app with Electron
  • cordova-electron-installer-icon.png - cordova Electron installer icon. Appears if your project targets desktop app with Electron
  • cordova-osx-icon.png - cordova macOS icon. Appears if your project targets desktop macOs app
  • web-icon.png - web icon. Appears if your project targets "web app" or "PWA"
  • apple-touch-icon.png - iOS web icon. Appears if your project targets "web app" or "PWA"

Generate Assets

To generate your own icons and splash screen images, you will need to replace all assets in this directory with your own images (pay attention to image size and format), and run the following command in the project directory:

$ framework7 assets

This command will generate all required sizes of icons and splash screens and place them automatically where they need to be.

Skip Update

On assets command CLI will first check for CLI update to always deliver latest and better experience. If, for some reason, you want to disable it, you can run command with --skipUpdate flag:

$ framework7 assets --skipUpdate

User Interface

Framework7 CLI allows to launch assets generation process with the user interface.

To launch it with UI, run the assets command with --ui flag in the directory with your app.

$ framework7 assets --ui

It will launch UI where you will be able to replace assets with custom ones and generate the required icons.

By default it launches server on localhost:3001 address. If you want to change the port then use --port <n> argument:

$ framework7 assets --ui --port 8080

NPX

If you didn't install Framework7 CLI globally, you can generate assets using npx command.

For example:

$ npx framework7-cli assets --ui