Git Product home page Git Product logo

cordova-res's Introduction

Resource Generator

This tool will crop and resize JPEG and PNG source images to generate images for modern iOS and Android devices. It will also register the generated images in config.xml so that Cordova projects are updated accordingly.

Install

$ npm install -g cordova-res

Usage

cordova-res must run at the root of a Cordova project, such as:

resources/
├── icon.png
└── splash.png
config.xml
  • resources/icon.png must be at least 1024×1024px
  • resources/splash.png must be at least 2732×2732px

To generate resources with all the default options, just run:

$ cordova-res

cordova-res accepts a platform for the first argument. If specified, resources are generated only for that platform:

$ cordova-res ios

Otherwise, cordova-res looks for platforms in config.xml (e.g. <platform name="ios">) and generates resources only for them.

Documentation

See the help documentation on the command line with the --help flag.

$ cordova-res --help

Adaptive Icons

Android Adaptive Icons are also supported. If you choose to use them, create the following additional file(s):

  • resources/android/icon-foreground.png must be at least 432×432px
  • resources/android/icon-background.png must be at least 432×432px

A color may also be used for the icon background by specifying the --icon-background-source option with a hex color code, e.g. --icon-background-source '#FFFFFF'.

Regular Android icons will still be generated as a fallback for Android devices that do not support adaptive icons.

📝 Note: Cordova 9+ and cordova-android 8+ is required.

Tips

.gitignore

To avoid committing large generated images to your repository, you can add the following lines to your .gitignore:

resources/android/icon
resources/android/splash
resources/ios/icon
resources/ios/splash
resources/windows/icon
resources/windows/splash

Programmatic API

cordova-res can be used programmatically.

CommonJS Example

const run = require('cordova-res');

await run();

TypeScript Example

run() takes an options object described by the interface Options. If options are provided, resources are generated in an explicit, opt-in manner. In the following example, only Android icons and iOS splash screens are generated.

import { Options, run } from 'cordova-res';

const options: Options = {
  directory: '/path/to/project',
  resourcesDirectory: 'resources',
  logstream: process.stdout, // Any WritableStream
  platforms: {
    android: { icon: { sources: ['resources/icon.png'] } },
    ios: { splash: { sources: ['resources/splash.png'] } },
  },
};

await run(options);

Cordova Reference Documentation

cordova-res's People

Contributors

bouraqadi avatar dependabot-preview[bot] avatar dependabot[bot] avatar dishuostec avatar imhoffd avatar ratson avatar renzoolguin avatar sc0ttdav3y avatar tobika avatar wannadream avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.