Skip to content

mtasa-typescript/resource-boilerplate

Repository files navigation

📄 TypeScript Resource Boilerplate for MTASA

Write and compile TypeScript into MTASA-compatible Lua code.

A documentation in your IDE. Types safety. Linting.

Features

  • 🔥 TypeScriptToLua
    Provides compilation
  • 📓 MTASA Lua Types
    Provides types declarations and the documentation for MTASA functions, variables and classes
  • MTASA Lua Utils
    Provides code preparation and MTASA specific linting
  • ✒️ Prettier
    Code formatter
  • 👀 ESLint
    ESLint for linting TypeScript Code

🎈 Getting started

💠 NodeJS

This boilerplate requires NodeJS (at least 14.x) to be installed. If you already have NodeJS installed, skip this step.

Installation for Windows.

Installation for Linux:

Debian or Ubuntu

apt install nodejs

Arch or Manjaro

pacman -S nodejs

How to check NodeJS installation (and version)

Open console (What?) and execute the command

npm version

🆕 Create new project (initialize boilerplate)

Open terminal in the parent folder of your new project and run folowwing command:

npx mtasa-lua-utils new-project

Structure

|- .idea/                     Configs for WebStorm
|- .github/                   Configs for GitHub
|- .vscode/                   Configs for VSCode
|- node_modules/              Modules for NodeJS (autogenerated directory)
|- src/                       Directory with TypeScript resources
    |- TypeScriptResource/    Example Resource
|- types/                     Directory with additional types
|- mtasa-meta.yml             Description for all resources (meta.xml analog)

All available commands

Compile the project

Command:

npm run build

Always running the command to build the resource is annoying. Below there are possible solutions to simplify it.

✏ Code Editor Preparation

VSCode

Using documentation

Ctrl+Mouse Hover is the shortcut to show documentation window.

Ctrl+Shift+Space is the shortcut to show function's parameters.

Tasks

Use Ctrl+Shift+B and select npm: build task to compilte the resource.

Trigger on save

Plugin Trigger Task On Save should be installed.

Configuration provided in .vscode/settings.json and will be enabled by default.

YAML Schema

Plugin YAML should be installed.

Provides helpful tips for mtasa-meta.yml file.

WebStorm

Using documentation

Ctrl+Q is the shortcut to show documentation window.

Ctrl+P is the shortcut to highlight function's parameters.

Configuration

NOTE: In the current version configuration should have been loaded by default.

In the top right corner press Edit Configurations. Press Add New Configuration (Plus icon), select npm and select build in Scripts field.

Configuration

Now you can press Shift+F10 to compile your resource.

File watcher

NOTE: In the current version file watcher should have been loaded by default.

Compile can be executed after file saving.

Open Settings -> Tools -> File watchers. Add new file watcher for TypeScript files in project scope. Put npm into the Script field and run build into the Srguments field.

File Watcher

Thus, saving after editing TypeScript files triggers compilation.

🚁 Support

Discord Server