Installation

Recommended Installation

Once you have Node.js installed, the easiest way to get started with KAPLAY is to use our installation package, which will generate a project for you using the recommended structure.

npx create-kaplay myGame && cd myGame

Then, using npm run dev you can start the development server, where you can test your game locally at https://localhost:5173.

npm run dev

That’s it! You’re ready to start making games. If you want to know all the options available in the create-kaplay package, run npx create-kaplay --help.

Zero Bundlers Installation

If you prefer to use KAPLAY without any bundlers, you can! Start with an index.html file:

<html>
  <head>
    <title>My Game</title>
  </head>
  <body></body>
</html>

Serve your statics!

For using the CDN and HTML correctly, you can’t just open the index.html, you need to serve your files. Run http-server:

npm install --global http-server

http-server # Serve your files!

Now, for using KAPLAY library with a CDN, we have 2 methods:

Method 1: JavaScript Modules (Recommended)

You can import KAPLAY using JavaScript modules. This is the recommended method. Create a main.js script file and connect it to your index.html:

<body>
  <script type="module" src="./main.js"></script>
</body>

Then, import the KAPLAY library inside index.html:

// main.js
import kaplay from "https://unpkg.com/kaplay@3001.0.19/dist/kaplay.mjs";
kaplay();

Method 2: Legacy JavaScript

Create a main.js script file. Connect both main.js and KAPLAY library into your index.html:

<head>
  <script src="https://unpkg.com/kaplay@3001.0.19/dist/kaplay.js"></script>
</head>

<body>
  <script src="./main.js">
</script>

Custom Node.js Installation

So, you’re a pro? Let’s get into creating our own template using Node.js. First, we need to install KAPLAY library in a fresh folder:

npm install kaplay

You’ll need to use a bundler to use KAPLAY with NPM. There’s a lot of options like esbuild, webpack, parcel, vite, etc. This is a short example using esbuild.

npm install esbuild

Once you have esbuild installed, and you have this in a .js or .ts file:

import kaplay from "kaplay";

kaplay();

just run

esbuild game.js --bundle > build.js

and it’ll find the KAPLAY package and include it in the built build.js, include build.js in your HTML and you’re good to go. Feel free to automate this process.

Plugins

Basic Concepts