0.0.2 • Published 3 years ago
multi-layers-image v0.0.2
Multi Layers Image
Multi Layers Image is a javascript library to generate image from some images with transparent (webp, png, svg, ...) or with a configuration with a seed to always generate the image with the same configuration and seed.
Exemple:
- Useful to generate a custom and random avatar.
This lib can be used directly on your front
Compatible Typescript and Javascript but not working for Node
Installation
npm install multi-layers-image
# OR
yarn add multi-layers-image
Usage
There is 2 features:
Superpose
import { superpose } from 'multi-layers-image'
const image = await superpose(
[
"https://cdn.pixabay.com/photo/2017/06/20/04/42/cloud-2421760_1280.png",
"https://cdn.pixabay.com/photo/2020/02/19/07/16/transparent-4861535_1280.png"
],
{
width: 250,
height: 250,
mimetype: 'image/png'
}
);
GenerateFromConfig
import { generateFromConfig } from 'multi-layers-image'
const image = await generateFromConfig([{
name: "FirstLayer",
images: [
"/Layer01/1.svg",
"/Layer01/2.svg",
"/Layer01/3.svg",
]
},{
linkedToName: "FirstLayer",
images: [
"/Layer02/1.svg",
"/Layer02/2.svg",
"/Layer02/3.svg",
]
},{
images: [
"/Layer03/1.svg",
"/Layer03/2.svg",
"/Layer03/3.svg",
]
}],
{
width: 250,
height: 250,
mimetype: 'image/svg+xml'
}
);
Image Format
Images can be passed as absolute url, relative url, Blob or as string for Svg
Contributing
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.
Please make sure to update tests as appropriate.
License
Command on this repository
clean
delete build folder, to clean artifactory of a previous buildtypecheck
check if the compilation is ready without generate anything, to check types, links, ...typecheck:watch
listen all changes to confirm everytime if the build stay safebuild
will build with webpack everything intobuild/
folderbuild:lib
only build the libbuild:lib:esm
only build the esm version of the libbuild:es
only build ECMAScript modulebuild:umd
only build UMD modulebuild:umd:min
only build UMD module in minify versionbuild:copyfiles
copy metadata like package, license, ... to the build foldertest
launcher test with jesttest:watch
listen all changes to exec tests each timeslint
detect lint errors and warnings in every fileslint:fix
format and fix every lint errors and warningsprerelease
Auto formatting when publishing the library (prettier + tslint + tests)release
publish the package in NPMrelease:local
install locally the package
How to release
Prerequis
- Working test with Jest
Workflow
- Be sure to have all dependencies or
npm install
- You can make use of
npm typecheck
- You can make use of
- Dev as you want
- Build with
npm run build
, to generate final artifacts- Note: the build process will automatically run type checking.
npm run prerelease
to get everything ready for release, including code formatting with prettier + tslint and test stage.
For testing
- From this project use
cd ./build && npm link
, to prepare npm to be link to an other one - From on other project use
npm link multi-layers-image
, in order to test the package
To Clean
- From this project
cd ./build && npm unlink
- From the test project
npm unlink --no-save multi-layers-image
Now we have 2 options:
npm run release:local
to install locally our package through a symlink from thebuild
folder to your local npm cache.npm run release
to finally publish your package in npm.
Thanks
This library was generated thanks to https://github.com/fjcalzado/library-ts-boilerplate