[Tutorial] PAWN Syntax and Compiler for Visual Studio Code
#1

PAWN Syntax and Compiler for Visual Studio
About

I started use Visual Studio Code by Microsoft as a code editor for my web design needs only. A couple of days ago I actually started used it to script my PAWN scripts with it. Since then, I haven't looked back at all! This editor is so awesome. It has so many features which you can put to good use to help you towards your own development needs. It's simple UI, integrations, extensions and more make this such an awesome editor. It's pretty much an editor to let you customize it to make it your own. You can find out more about it here: https://code.visualstudio.com/docs

This tutorial will show you how to set up the PAWN Syntax and PAWN Compiler in Visual Studio. Let's begin.

The following are required to go on with this tutorial:

Visual Studio Code - https://code.visualstudio.com/?wt.mc_id=vscom_downloads
SA-MP Server Package (it has the PAWN compiler in it, so be sure you have it) - http://www.sa-mp.com/download.php

Before we begin setting up, I advise that you should follow every single step in this tutorial and not skip any steps to ensure proper installation and a working compiler ready to go.

Part One- Installing Visual Studio

Head on over to the link provided above to download Visual Studio Code. Once on the page, select your platform you wish to download Visual Studio Code for.

You can also scroll down on the page for an insight on some of the core features which makes Visual Studio so awesome.

Once your download begins, wait for it to finish. Once finished, open up the installer to begin the installation process.

Now, this process and easy and fairly simple so I won't provide any more details on it. Just read and agree to the terms, select the installation path of your choice, etc.. and let it install.

Installing the PAWN Syntax

I take no credit for the PAWN Syntax, all of it goes to Diego Cea for creating it.

Once you've completed the installation process, launch Visual Studio. When you've opened it, a 'Welcome' document will open up just to showcase the editor itself. You can go on and read the document as it has some useful information, but this is your choice.

Now that we've got that out of the way, click on the 'Extensions' tab or press CTRL+SHIFT+X together. You'll find the tab on the left side of the editor.



The extensions tab, highlighted in red.

Once on the tab, find the search box. Click on the box, and type in 'PAWN', the first extension that should come up will be named 'Pawn Scripting Language Support.' Click on the extension, on the right side it should come up with the page detailing out all the information about the extension. You should then be able to see a green button called Install, click on it and let it install (in this case, I already have it installed so it won't give me the option to install it again). Once it installs, you will receive a message saying its been installed and that the editor must reboot. Click on the reboot button and let the editor reboot, it should only take a couple of seconds to come back.



1. The search box, 2. The PAWN Syntax extension, 3. Install button

Once rebooted, go ahead and open up a .pwn file. You should notice that all functions, macros and such will be colored instead of being white. This means you have successfully installed the syntax highlighting. Note that colors may depend on the type of theme you are using.



The PAWN Syntax in action.

We have now done the following:
  • Installed Visual Studio
  • Installed the PAWN Syntax Highlighting Extension
That completes part one, its now time to set up the compiler in order to compile our scripts.

Part Two - Setting up the compiler

Lets begin setting up the compiler.

Start off by creating a shortcut for Visual Studio. Simply right click on Visual Studio Code.exe and click on 'Create Shotcut.' Once you've done that, drag the created shortcut into the folder of your project. For example, I have folder solely dedicated to my server. It has everything including the SAMP server package in it. Thats where my .pwn files are, so I'll put the .exe in there.

Once you done that, run the .exe shortcut you just created from inside your projects folder. Right after you open Visual Studio Code from your projects folder, you should notice that a .vscode folder has been created where the .exe launched from.



The .vscode folder will be created right after you launch the .exe from your projects folder.

Once you've seen that a folder has been automatically created, head back into Visual Studio Code.

From inside Visual Studio, click on Tasks > Configure Tasks. You should see a new file named tasks.json has opened up. In the file, copy and paste the following into it:

PHP Code:
{
    
"version""2.0.0"
    
"type""shell",
    
"args": ["${relativeFile}"], 
    
"windows"
    { 
        
"command""${workspaceRoot}\\pawno\\pawncc.exe" 
    
}



The tasks.json file.

Now we wont need to change the path of the PAWN compiler since workspaceRoot means where we launched Visual Studio from. Thats where our pawno folder is.

Once you've entered the above in, hit CTRL+S (This will save the file. It should automatically save it into .vscode without asking you to do it). You can now close the file.

Now that we have the compiler set up, we now have to set up the key binding in order to compile. As most people use PAWNO, the compile binding is F5. We haven't set that up yet, but its pretty simple. Lets do it.

Head on over to File > Preferences > Keyboard Shortcuts. It should open up a file with all keybinds automatically assigned. We want to create and add our own, so right under the search box, click on keybindings.json.



All keybindings can be added here.

Once you've done that, it should open up two files in one. Now on the left side is all the default keybinding, we don't want to change that. What we want to do is add our own, so that will be on the right side in keybindings.json.

Copy the below, and paste it into the right panel (keybindings.json).

PHP Code:

    { 
"key""f5""command""workbench.action.tasks.build" 



Custom key bindings can be added into keybindings.json.

Once the code above has been pasted into the .json file, hit CTRL + S once again to save the file. It shouldn't ask you where to save it. You can now close the file.

To set the PAWN Compiler as the default compiler for Visual Studio Code, simply go to Tasks > Configure Default Build Task and select the PAWN option. Once you've done this, you won't have to keep choosing what type of compiler option to use when compiling. Instead, it will just start compiling with the PAWN compiler.

And there we go, we have successfully done the following:
  • Installed Visual Studio
  • Installed the PAWN Syntax Highlighting Extension
  • Successfully set up the PAWN Compiler
(NEW!)(Optional) Auto Completions

Special thanks to Chaser98 for creating the auto completions library. If you'd like to use auto completions to make work flow easier, visit this link https://github.com/adamw01/pawn-vs-code-completions and copy all of the contents from pawn.json. Once you have copied everything, head back into the editor and press CTRL+SHIFT+P while on a .pwn file and select "Open user snippets." You can then paste all the contents from the GitHub repo into pawn.json which the editor created.

-------

Following the steps above should give you a working PAWN syntax highlighting and a PAWN compiler in Visual Studio. Let's go ahead and test it out and see if it works. Before doing this, you can close Visual Studio and open it again just to reboot the software itself.

Open the editor back up from your project folder, then open up any PAWN file, write some stuff in it. Once done, press F5.



A .pwn script successfully compiled in Visual Studio Code.

So there we go, PAWN syntax highlighting and a PAWN compiler in Visual Studio. From here on you may start working on your scripts as it should be fully functional.

Here are some useful links for making Visual Studio even better:
Need help?

If you require assistance, want to ask a question or anything else, then please post here in this thread and I'll be sure to help you out as soon as possible !

FAQ

1) How do I show the auto complete functions without the ones that don't have auto complete?

Take a look at this post: http://forum.sa-mp.com/showpost.php?...2&postcount=17

2) When compiling with YSI 4.0, I get errors on Visual Studio Code but none on PAWNO?

Please view the two following posts: http://forum.sa-mp.com/showpost.php?...9&postcount=19
http://forum.sa-mp.com/showpost.php?...0&postcount=20
Reply
#2

Ey nice one, Totally helpful, I will use it if I started editing the gamemode with visual studio code, Keep up!
Reply
#3

It's the best, thanks for sharing this information!
Reply
#4

omg very nice, thank you so much.
Reply
#5

Good job! Very good!
Reply
#6

AWESOME !
That's exactly what am i looking for !
Again, FreAkeD impress us with his awesome & Helpful posts.
Thank you
+Rep !
Reply
#7

Good might give this a try,
When scripting pawn Sublime text > Visual Studio
When working on web design Brackets > Visual Studio
Reply
#8

Quote:
Originally Posted by Eoussama
View Post
Good might give this a try,
When scripting pawn Sublime text > Visual Studio
When working on web design Brackets > Visual Studio
That's exactly what I used to think myself too, but obviously opinions change I guess.

Brackets in particular was one of my favourites to do web design with, the live preview feature was just too awesome!
Reply
#9

// resolved
Reply
#10

Nice tutorial. I've been using VS Code for PAWN for a while. I managed to convert Southclaw's sublime completions to VS Code snippets. Feel free to use it.

https://gist.github.com/Chaser98/69b...1df76092cb86a1

To install it just CTRL+SHIFT+P while on PAWN language and select "Open user snippets", then copy the contents of the gist to the pawn.json it created.
Reply
#11

I really want to give this a shot, but I don't seem to find the extension
Reply
#12

I think you downloaded the wrong one: https://code.visualstudio.com/?wt.mc_id=vscom_downloads
Reply
#13

@Eoussama: You have to download Visual Studio Code, not the IDE, I think thats what you downloaded.

@Chaser98: Very nice stuff. I haven't tried it out yet though. I'll be sure to add your link to the main topic asap then, cheers for creating it!
Reply
#14

When i create shortcut but when i launch it it don't create the .vscode folder
Reply
#15

Quote:
Originally Posted by HoussemGaming
View Post
When i create shortcut but when i launch it it don't create the .vscode folder
Did you create the shortcut inside your project folder and open the .exe from there?
Reply
#16

Amazing! Now I'll never open sublime text ever again.

---

Edit: after setting it up, looks like there's something to be fixed, basically when you type "settimerex" (or any other functions) it'll show you 2 versions, one with the auto complete and one without, this might be confusing, not sure how it could be fixed though.
Reply
#17

Quote:
Originally Posted by iKarim
View Post
Amazing! Now I'll never open sublime text ever again.

---

Edit: after setting it up, looks like there's something to be fixed, basically when you type "settimerex" (or any other functions) it'll show you 2 versions, one with the auto complete and one without, this might be confusing, not sure how it could be fixed though.
Indeed, I'll do some research and see what I can find out to fix it .

-----

EDIT: I found a way you can show the snippets at the top, basically showing the other ones that don't enter parameters automatically at the bottom (http://imgur.com/wF8JnGv)

To do this, follow the steps below:

Go to File > Preferences > Settings. This should open the the 'User Settings.' Once there, copy and paste the following into the right hand side, NOT THE LEFT!:

PHP Code:
"editor.snippetSuggestions""top" 
Here's a picture of what it should look like (http://imgur.com/a/i3P6H).

Remember to have a trailing comma above if there's other settings you'd added, the last one doesn't need one (see the example pic above this message to see what it should look like.)

Once you'd done that, hit CTRL + S to save the file, then you can go ahead and close it. Head into any file and you should notice all the custom snippets should be appearing on the top (http://imgur.com/wF8JnGv).
Reply
#18

It seem that VS Code doesn't like YSI 4.0...
I get some errors when compiling it in VS Code , but in Pawno it works without errors... If I don't use YSI everything works fine...
Reply
#19

IIRC YSI requires -)+ flag to be set (and maybe -;+)
Reply
#20

@Misiur thanks, used this and now works:
Code:
d:\\Path_To_Compiler\\pawncc.exe =)+ -;+
Reply


Forum Jump:


Users browsing this thread: 2 Guest(s)