[Release] NativeUI in Typescript

FiveM Releases
1

Hey!
If you were looking for a NativeUI port written in typescript, this is here.

FiveM-NativeUI

This project is a (fully TypeScript compatible) FiveM port of someone’s else port. It provides a simple way to use NativeUI menus in your clientside scripts. All credits to the original authors: datWeazel, DurtyFree and Kar.

Usage:

With bundler:

  1. Create in your package.json location a file named .npmrc and add this line:
    @pichotm:registry=https://npm.pkg.github.com
  2. Install by run npm install --save @pichotm/fivem-nativeui.
  3. Add this line to top of file where you want to use NativeUI.
    import * as NativeUI from "@pichotm/fivem-nativeui";

Without bundler:

  1. Download .zip archive you want from releases page.
  2. Unpack archive in client’s folder, and import like any other typescript file:
    # nativeui
import * as NativeUi from "nativeui/nativeui";
    • Don’t forget include nativeui folder in client_scripts section of your fxmanifest.lua

Example Menu

examples\nativeUI-example

Result:
image

8 Likes
2

FYI V8 here doesn’t do ESM by default as this didn’t exist in 2015 :stuck_out_tongue:

3

I know this is a (fairly) old library. But since I much prefer typescript for creating my scripts, this seems to be my only choice to use for a NativeUI menu. So far using this has been a great experience! But I do have a question. How can I manage to right align my menu? Setting my NativeUI.Point() seems to do it on 1 resolution, but this does not scale to other resolutions.

Thanks in advance if you could kindly provide a response!