After a little tinkering, I've come up with a way to get working syntax checking and refactoring for Bela projects in VSCode. I prefer working with the build scripts with Bela, but I miss the syntax checking in the browser IDE for catching silly errors. I'm not a big fan of Eclipse myself, so I figured I'd try to get VSCode to recognize Bela projects.

The Eclipse workspace tutorial, using @AndyCap 's awesome cross-compiler, is a good starting point, so all that really needs to be done is to set the include and compiler paths, and set up a build task for building the project.

Here's how I did it for my system (I'm on macOS 10.13):

  1. If you don't already have it, install the C/C++ for VSCode extension.
  2. Follow the Eclipse tutorial until you get to "Setup Eclipse."
  3. The SyncBelaSysroot.sh script doesn't currently copy the new libraries folder correctly, so from your Bela root directory, run cp -r libraries/ /usr/local/linaro/BelaSysroot/root/Bela/include
  4. Now, in your VSCode workspace, open or create .vscode/c_cpp_properties.json and add the following under "configurations":
    {
    	"configurations": [
    		{
    		"name": "Bela",
    			"includePath": [
    				"/usr/local/linaro/BelaSysroot/root/Bela/include",
    				"/usr/local/linaro/BelaSysroot/usr/include",
    				"/usr/local/linaro/BelaSysroot/usr/local/include"
    			],
    			"intelliSenseMode": "gcc-x64",
    			"compilerPath": "/usr/local/linaro/arm-bela-linux-gnueabihf/bin/arm-bela-linux-gnueabihf-g++",
    		}
    	],
    	"version": 4
    }
    Restart the IDE. If all goes well, all the handy features like refactoring, code completion, and syntax checking should now work in your Bela project. Note that since this configuration is local to the current workspace, you'll have to do the same setup in any other Bela projects you want to work on in VSCode.

For the build task, I have a little script called ./build.sh in my project's root directory. It essentially calls the Bela build script build_project.sh with a few arguments, which you can obviously customize:

#/bin/sh
../path/to/Bela/scripts/build_project.sh . --force -c "-H -6 --disable-led 1"

To set this script as the default build task in your workspace, open or create .vscode/tasks.json and add this:

{
	"version": "2.0.0",
	"tasks": [
		{
			"label": "build",
			"type": "shell",
			"command": "./build.sh",
			"group": {
				"kind": "build",
				"isDefault": true
			}
		}
	]
}

Now, you can build the project on the Bela by selecting Terminal > Run Build Task in the menu bar.

Let me know if this works for other people! I have not implemented all of the features that the Eclipse tutorial does, namely debug builds and the oscilloscope. The cross-compiler's gdb executable should probably work with VSCode, I haven't tested it though. The oscilloscope is still accessible by going to http://bela.local/scope/ in a browser while a Scope project is running. Still, I'm glad that it works as well as it does, and I bet a similar process could be used to get this working in other IDEs too.

edit: SyncBelaSysroot.sh misbehaves if /usr/local/linaro and its children are not owned by your user, fix this by running sudo chown yourUser /usr/local/linaro and sudo chown yourUser /usr/local/linaro/* and running the script again.

2 years later
2 years later

Hey, thanks for sharing your repo!

i´m following the instruction over here ( https://learn.bela.io/using-bela/technical-explainers/scripts/#build_projectsh ) and although I have a render.cpp file in the directory I get the ERROR :

ERROR: Please provide a directory containing .c, .cpp, .S, .pd or .scd files.

maybe it has something to do with this? @giuliomoro

alt text

i navigated to root@bela:~/Bela/include# and there is the header file Bela.h is listed

i guess the question I have is : "how can I set an include on a remote device in vscode?"

    I know nothing about VSCode or Bela/VS Code integration.

    D300 ERROR: Please provide a directory containing .c, .cpp, .S, .pd or .scd files.

    This is an error due to the fact that the path passed to the build_script.sh program does not contain any files that match the requisites listed there.

    D300 i guess the question I have is : "how can I set an include on a remote device in vscode?"

    no idea about VSCode but you may have to use sshfs so that the remote filesystem can be accessible to VSCode. OTOH, if you are following @fjacomme's instructions, this

    fjacomme You can setup VS Code without the need for cross-compilation using the SSH remote session.

    should mean that you don't need that.

    2 months later

    Hey, I´m trying to run a shell script via task runner...
    my task.json looks like this:

          {
            "label": "BELA - Run Project",
            "type": "shell",
            "command": "/root/Bela/scripts/build_project.sh",
            "args": [ "/root/Bela/examples/Fundamentals/print/" ],  
            "presentation": {
              "reveal": "always",
              "panel": "new"
            },
          },

    how can i add the -p flag to avoid the prompt "Project `print' already exists on the board, do you want to overwrite it? (y/n): " ?

    this does not work:

            "label": "BELA - Run Project",
            "type": "shell",
            "command": "/root/Bela/scripts/build_project.sh",
            "args": [ "/root/Bela/examples/Fundamentals/print/", "-p print" ],  
            "presentation": {
              "reveal": "always",
              "panel": "new"
            },
          },

    is "print" the correct project-name? ( the foldername before the render.cpp )

      you shouldn't need the -p option unless you want the project on the board to have a different name from the project folder on your computer. To avoid the prompt, use --force.

      D300 "args": [ "/root/Bela/examples/Fundamentals/print/", "-p print" ],

      by the way, I think that if you indeed wanted to pass the -p option (or any other option that takes arguments), you should do so by having two different elements in the array, one for the option and one for the argument, e.g.:

      "args": [ "/root/Bela/examples/Fundamentals/print/", "-p", "print" ],
      6 months later

      fjacomme When I try this I get an error due to the older version of GLIBC on the Bela Mini : v2.24 is installed and the error message calls for 2.25.
      Does anyone know if there is a problem with updating to 2.25 on the Bela Mini?

      This is the error message:
      /root/.vscode-server/bin/abd2f3db4bdb28f9e95536dfa84d8479f1eb312d/node: /lib/arm-linux-gnueabihf/libc.so.6: version `GLIBC_2.25' not found (required by /root/.vscode-server/bin/abd2f3db4bdb28f9e95536dfa84d8479f1eb312d/node)

      phew, that one comes with the 'DO NOT USE THIS IMAGE' warning... I think I might wait until it's stable 🤪

      It's very stable and I use it daily; the reason I don't recommend it in general is that the compiler is slower than on the "stable" image, but in your case I think you are using a cross-compiler, so it shuoldn't affect you.