NOTICE: This extension is currently partially incompatible with the Rojo extension for VSC (see here for what exactly isn’t working). I have no idea why, nor does that extension’s maintainer. I’m working on fixing this, but it might take some time. For now, the only alternative is to use the Rojo CLI.
DISCLAIMER #1: This extension is not complete. I’m currently waiting for Rojo’s two-way sync API to be more fleshed out before adding any more functionality.
DISCLAIMER #2: This extension relies on Rojo to open files. As of writing, Rojo will always use your default editor to open files, so make sure that your default editor for .lua files is VS Code. You can see how to do that in this reply. Also note that if you have more than 1 VS Code window open, this extension cannot guarantee that your script will be opened in the correct window, so I would recommend only having 1 open.
I’ve just spent the last day or two working on an extension for Visual Studio Code that’ll make Roblox development on your file-system feel a bit more familiar.
Never used Rojo before? Read about it here!
A few things have always bothered me about Rojo:
- Required to append
.server.lua. The requirement in itself is fine, but it’s really ugly.
- Required to have a
initfile inside of a folder for any source containers with children. Again, fine with the requirement in itself, but it’s really ugly.
- Hard to easily distinguish between classes. Sure, you’ve got your
.client.lua, but it just clutters your view in my opinion.
- Can’t see the contents of a .rbxm file without studio open. Not as important, but still a bit annoying.
To sum things up, I hate how messy my tree view gets when using Rojo, so I came up with a solution.
A Roblox-inspired graphical interface for Rojo
Noob User: “Woah, woah, woah, Muoshuu! You can’t just go around making graphical interfaces!”
Yes. Yes I can.
So what’s it do?
To put it simply, you can:
- Connect to multiple instances of Rojo from a single window
- Open and modify Scripts, LocalScripts, and ModuleScripts
- View the properties of any instance Rojo manages
- Use your own custom class icons
Note, however, that this extension still requires a Rojo project be set up like normal. You’ll still be appending
.server.lua and adding your
init.lua files to folders. After that, you can switch over to the extension’s view and take in the beauty.
Wow, that’s a lot of cool stuff! What doesn’t it do?
Basically everything else. Rojo’s two-way sync API isn’t fleshed out enough for me to add any additional functionality. Eventually, I plan on supporting the following:
- Modifying properties from the properties view
- Managing instances (creating, deleting, moving, copying, etc…)
- A GUI for Rojo’s project configuration
This sounds cool and all in theory, but I have yet to see it in action!
so much for the trust we’ve been building up for the last few minutes. here’s a video
Alright, where do I get it?
You can find the extension itself either by searching for Rojo UI in Visual Studio Code’s extension manager or by clicking here.
You can also check out the source code here! It’s a bit unrefined at the moment, but it’ll definitely get better over time.
What version of Rojo does this extension require?
Why should I use this? How does it benefit me?
As of writing, there is no real benefit to using this extension. It does not offer anything that would speed up development. This extension is purely for aesthetics.
When I click a script, nothing happens, or something like notepad opens. What gives?
This extension relies on Rojo to open files. As of writing, Rojo will always use your default text editor to open any files. I cannot change this. Also note that any scripts inside of a
.rbxm file cannot be opened.
This reply contains a guide on how to change your default editor.
Why don’t I see my entire place in the explorer?
This extension relies entirely on Rojo for any information it receives, and Rojo only has information on the instances it manages. For this reason, it is impossible to show any instances that are not managed by Rojo. To make Rojo manage an instance, it must be defined in Rojo’s project config.
Why are the values of some properties things like
Unknown BrickColor value?
As with the above answer, this means that Rojo does not have information on the value of that property. Usually, this only occurs with values that are based on other properties (like how Part.BrickColor is based on Part.Color).
Why are some of the values of properties incorrect?
For any properties that Rojo doesn’t have any information on, this extension will attempt to show the default value that Roblox applies. This might be different from the actual value, and if no default value exists, the value will show up as
Unknown VALUE_TYPE value.
How do I use custom icons?
Open the extension’s configuration and set the
Icon Folder field to the absolute path of the directory containing your icons. Note that the icons must be
.png files and must be named exactly the same as the class.
If you have additional questions, feel free to ask.