fivem-js 
Current Version: v1.5.2
Recently I’ve noticed an influx of FiveM users interested in developing resources using Typescript or Javascript. Typings and auto-complete for natives already exist using the @citizenfx/client and @citizenfx/server packages provided by FiveM, but these only give access to the natives.
This npm package tries to enhance this by providing a common set of classes and functions, just like the C# counterpart used for C# development - CitizenFX.Core.Client.dll.
Important Links
Source Code: Link
npm Package: Link
Documentation: Link
What is fivem-js?
Javascript/Typescript wrapper for the FiveM natives.
Functionality of this wrapper is based on the FiveM C# wrapper - link. It’s a feature-rich set of helper classes, objects, and functions to help you develop your project faster.
This package is especially useful for those coming from C#.
Features
- One dependency @citizenfx/client
- Abstracts common used FiveM practices
- Entity management through class objects (i.e.
VehicleandPedentities) - UI elements such as
scaleformsand loadingprompts -
New! NativeUI-like menu class (
Cfx.Menu) - example - Audio, Blips, Cameras and more… In other words, whatever the FiveM C# wrapper can do, this package can as well.
Note: Not all features are currently available. They will be added as development continues as well as additional language specific features. If you are a developer, please provide Pull Requests and/or improvements.
Installation
Simply install it as a node module - npm i fivem-js or yarn add fivem-js.
Usage / Examples
Make sure you are using webpack so that you can require (Javascript) or import (Typescript) node_modules.
Typescript:
import * as Cfx from "fivem-js";
RegisterCommand("adder", async (source: number, args: string[]) => {
const position = Cfx.Game.PlayerPed.Position;
const heading = Cfx.Game.PlayerPed.Heading;
const model = new Cfx.Model("adder");
const vehicle = await Cfx.World.createVehicle(model, position, heading);
Cfx.Game.PlayerPed.setIntoVehicle(vehicle, Cfx.VehicleSeat.Driver);
}, false);
You can also individually import classes.
import { World } from 'fivem-js/lib/World';
Javascript:
/// <reference path="node_modules/fivem-js/lib/index.d.ts"/>
/// <reference path="node_modules/@citizenfx/client/natives_universal.d.ts"/>
const Cfx = require('fivem-js');
RegisterCommand("adder", async(source, args) => {
const position = Cfx.Game.PlayerPed.Position;
const heading = Cfx.Game.PlayerPed.Heading;
const model = new Cfx.Model("adder");
const vehicle = await Cfx.World.createVehicle(model, position, heading);
Cfx.Game.PlayerPed.setIntoVehicle(vehicle, Cfx.VehicleSeat.Driver);
}, false);
Contributing
You are more than welcome to contribute to this project by submitting a pull request and creating issues.
I encourage you to test the features and add what you find missing. A guide on how to contribute will be added in the near future (keep an eye out on the repository). For now, please pull request to the development branch!
Final Words
This tool is not complete, but will be actively developed over time. The basic features such as entity creation and manipulation work as well as other common features such as Scaleforms and HUD elements. Please keep up-to-date with the source code to see what is currently implemented.
I am in the process of learning Typescript as well, so if you see any improvements, please let me know. I encourage everyone to at least try out Javascript or Typescript with or without this package.
You can modify or edit the code as you like, but you cannot re-release it. Please see the LICENSE
Thank you for this. I haven’t heard any feedback regarding performance/features, so please report back once you’ve used it.
what items to add, let me know!
