Skip to main content

Installation

This guide will show you how to get up and running with Flamework!

Flamework template​

If you're starting a new project, the simplest way to setup Flamework is to use our template.

Create your project folder​

You'll want to create the folder where your project will be stored. This can be anywhere on your pc.

Create the template​

After you've made your project folder, run the following commands inside of the directory.

npx degit rbxts-flamework/template
npm i

Updating Flamework​

Whilst I try to keep the template up to date, sometimes it falls behind either current Flamework versions, current roblox-ts versions or even current Roblox typings.

You can ensure that you're on the latest Flamework and roblox-ts by running the following commands after setting up the template.

# Update Flamework
npm i rbxts-transformer-flamework@latest @flamework/core@latest @flamework/networking@latest @flamework/components@latest

# Update roblox-ts
npm i roblox-ts@latest @rbxts/types@latest @rbxts/compiler-types@latest

Compiling​

You should use the build scripts to compile your project, otherwise Flamework may not work properly. Alternatively, you can use the vscode extension which will start up watch mode for you.

npm run build # Build your project
npm run watch # Start watch mode

Manual installation​

For existing projects.

Setting up your project​

Navigate to the directory that you want to place your project. This can be anywhere on your computer.

After creating your project folder, you'll want to setup a new roblox-ts project. You can do this by opening command prompt, bash or powershell and running the following command.

npx roblox-ts init game

The command will ask you several questions about what to setup and you can choose whatever you'd like.

Installing Flamework​

Now that you have your project setup, it's time to install Flamework.

Packages​

First off, you'll want to install the flamework library and transformer.

npm i -D rbxts-transformer-flamework
npm i @flamework/core

You can optionally install the following additional modules. Documentation can be found under the additional modules section.

npm i @flamework/components # Flamework's component system
npm i @flamework/networking # Flamework's remote networking module

Configure tsconfig.json​

Next, you'll need to configure your tsconfig.json. You'll want to add the following json under your compilerOptions field.

"experimentalDecorators": true,
"plugins": [
	{ "transform": "rbxts-transformer-flamework" }
]

You'll also need to add the @flamework scope to your typeRoots.

"typeRoots": ["node_modules/@rbxts", "node_modules/@flamework"]

Configure default.project.json​

Find the following json inside your default.project.json

"node_modules": {
	"@rbxts": {
		"$path": "node_modules/@rbxts"
	}
}

After you've found it, you'll want to replace it with the following json.

"node_modules": {
	"@rbxts": {
		"$path": "node_modules/@rbxts"
	},
	"@flamework": {
		"$path": "node_modules/@flamework"
	}
}

Compiling​

Now that you have Flamework installed, it's almost time for you to start writing some code!

Delete out​

Remove the out directory that got generated when you initialized your project. This is only necessary the first time you initialize the project, not after each build.

Installing roblox-ts​

Do not use a global install of roblox-ts. A local install inside of your project is necessary for Flamework to work.

Before you can start writing code with Flamework, you'll have to install roblox-ts in your project. You can do this simply by running the following command in your project's directory.

It is necessary to install roblox-ts@next until roblox-ts releases version 1.2.0

npm i -D roblox-ts@next

Build your project!​

It's time, you're ready to write some code. Simply run the following command in your project directory.

npx rbxtsc -w

If you're not a fan of using a command, roblox-ts has a vscode plugin that exposes a status bar button and commands that will compile your project for you!

Updating Flamework​

When it comes time to update the version of Flamework you are using, simply follow these steps.

Update the packages​

npm i @flamework/core@latest
npm i -D rbxts-transformer-flamework@latest

Reset your build​

You'll want to delete your project's out directory, as well as the autogenerated flamework.build file before attempting to recompile.

Build your project!​