Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including splash-screen-generator with all npm packages installed. Try it out:

var splashScreenGenerator = require("splash-screen-generator")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

splash-screen-generator v1.0.0

Easily generate splash screens to use in your PWA's.

splash-screen-generator

Generates splash screens for your PWA's!

Installation

$ npm install splash-screen-generator

Usage

const ssg = require('splash-screen-generator')

ssg(ssg.formats.ios, {
    // folder where to store the generated files
    destination: './splash',
    
    // Default size of the logo respect with the canvas
    // default .3
    logoScale: .5,
    
    // splash background color
    backgroundColor: '#27BAB4',
    
    // location of the logo
    logo: './logo.png',
    
    // rel: 'apple-touch-startup-image',
    
    rotate: false // defaults to true
  }).then(metaHead => {
    // t.true(Array.isArray(metaHead))
    console.log(metaHead)
  })
  
/*
[ 
  ...
  { href: '/splash/i-pad-retina-portrait-768-1024@1x.png',
    media: '(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 1) and (orientation: portrait)',
    rel: 'apple-touch-startup-image' },
  ...
]
*/ 

Use it with Nuxt

// nuxt.config.js
module.exports = {
  ...
  head: {
    link: ssg(ssg.formats.ios, {
      destination: './client/static/splash',
      backgroundColor: '#27BAB4',
      logo: './client/static/logo.png',
    })
  }
  ... 
}

TODO

  • Add more formats
  • Add position support for logo
RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free