Bl Svelte Template

BL Svelte Template

A template for creating FiveM resources using Svelte.

Current Features:

  • Svelte 4.0.
  • Debug Menu for testing in browser.
    • Can add buttons, sliders, inputs to emulate data being sent from the client.
    • Can define Event Handlers that pretend its being received in the client and can send back data.
  • TailwindCSS.
  • Can use localhost in fxmanifest for Hot Reloading inside FiveM which is no different from built version.
Github
Releases

Installation

Open the repo of the Svelte Template (opens in a new tab) and click "Use this template".

usetempalte

Set Up your new repo.

Open your new repo in VSCode.

Initialise

Open a new terminal and run pnpm install or npm install.

Run Development server

pnpm run dev or npm run dev to start the development server.

Setting Up listeners

web > utils > listeners.ts is where you can add your event handlers that will always be listening for events from the client.

Setting Up Debug listeners

web > utils > debug > receivers.ts are the events that will emulate a client RegisterNUICallback and can optionally send back data after processing it.

Setting Up Debug senders

web > utils > debug > senders.ts is where you can add your debug menu items that will show up in the debug menu when in the browser.

ExportsTemplate Guide