Getting Started

This section will provide you with the fundamentals of creating mods for Knockout City and start you on your modding journey.

Creating your first mod

Mods enable users to add fresh content, functionalities, or adjustments to Knockout City. A mod incorporates scripts, assets and a manifest file named manifest.yaml. Comprehensive guidance on the specific structure can be found in the Mod Structure section.

Basic structure

To begin, create a folder that includes the manifest.yaml file, which serves as the mod’s root. Additionally, create an index.ts file within the same folder as the entry point for the mod. To start with, let us employ a basic example:

// index.ts

// Include the logging module
import logging from 'logging';

logging.info('Loading mod');

Setting up Auto-Completion

Requirements:

• nodejs

To enable type completion, certain configuration is necessary. Firstly, we initiate the project by running the following command:

npm init    # npm
yarn init   # yarn
pnpm init   # pnpm

This should generate a package.json file within the directory.

Next, we aim to acquire certain types suitable for the sandbox environment. For this task, we will need to install typescript and the knockoutcity-mod-loader as a development dependency.

# npm
npm install --save-dev \
  typescript \
  knockoutcity-mod-loader

# yarn
yarn add --dev \
  typescript \
  knockoutcity-mod-loader

# pnpm
pnpm add --save-dev \
  typescript \
  knockoutcity-mod-loader

Next, we need to initialize TypeScript and create a tsconfig.json file within the directory:

// tsconfig.json

{
  "compilerOptions": {
    "module": "ES6",
    "moduleResolution": "Bundler",
    "target": "ES2020",
    "strict": true,
    "alwaysStrict": true,
    "allowSyntheticDefaultImports": true,
    "outDir": "./dist",
    "skipLibCheck": true
  },
  "include": ["src/*", "env.d.ts"]
}

This file specifies how to compile our mod into the required JavaScript format.

Now create an env.d.ts file in the same directory with the subsequent content:

// env.d.ts

/// <reference path="./node_modules/knockoutcity-mod-loader/types/sandbox-api.d.ts" />

Testing the mod

In order to test your mod you can use to CLI Tool of the mod loader.

npm i -g knockoutcity-mod-loader
npx knockoutcity-mod-loader

Shipping the mod

Firstly, we must compile our sources to JavaScript. This can be achieved with the following command in bash:

npx tsc   # npm
yarn tsc  # yarn
pnpm tsc  # pnpm

We can now package it by zipping the dist folder together with the manifest.yaml file. This will allow us to easily share our mod.