Creating an app with VS Code
Create the App
In a terminal, type the following to create a new project using dotnet new templates:
dotnet new unoapp -o MyApp --preset=blank -platforms android ios maccatalyst wasm gtk --vscode
Tip
MyApp is the name you want to give to your project.
This will create a blank template app that only contains the WebAssembly, Skia+GTK and Mobile platforms support.
Important
Mobile targets cannot be built under Linux. If you are using Linux, you'll need to remove android ios maccatalyst from the platforms list. The previous command would become dotnet new unoapp -o MyApp -preset=blank -platforms wasm gtk --vscode.
Next, open the project using Visual Studio Code:
In the terminal type the following:
code ./MyApp
Visual Studio Code might ask to restore the NuGet packages. Allow it to restore them if asked.
Once the project has been loaded, in the status bar at the bottom left of VS Code, MyApp.sln is selected by default. Select MyApp.Wasm.csproj, MyApp.Skia.Gtk.csproj or MyApp.Mobile.csproj instead.
Debug the App
Uno Platform provides integrated support for debugging your app on Windows, mac and Linux.
- In the debugger section of the activity bar select
Debug (Chrome, WebAssembly)
- In the status bar, ensure the
MyApp.Wasm.csproj project is selected - by default MyApp.sln is selected.
- Press
F5 to start the debugging session
- Place a breakpoint inside the
OnClick method
- Click the button in the app, and the breakpoint will hit
- In the debugger section of the activity bar select
Skia.GTK (Debug)
- In the status bar, ensure the
MyApp.Skia.Gtk.csproj project is selected - by default MyApp.sln is selected.
- Press
F5 to start the debugging session
- Place a breakpoint inside the
OnClick method
- Click the button in the app, and the breakpoint will hit
Note that C# Hot Reload is not available when running with the debugger. In order to use C# Hot Reload, run the app using the following:
On Windows, type the following:
$env:DOTNET_MODIFIABLE_ASSEMBLIES="debug"
dotnet run
On Linux or macOS:
export DOTNET_MODIFIABLE_ASSEMBLIES=debug
dotnet run
In the status bar, select the MyApp.Mobile project - by default MyApp.sln is selected.
To the right of MyApp.Mobile, click on the target framework to select net7.0-android | Debug
Then, to the right of the target framework, select the device to debug with. You will need to connect an android device, or create an Android simulator.
Finally, in the debugger side menu, select the Uno Platform Mobile profile
Either press F5 or press the green arrow to start the debugging session.
Note
Debugging for iOS is only possible when running locally (or remotely through Remote SSH) on a macOS machine.
In the status bar, select the MyApp.Mobile project - by default MyApp.sln is selected.
To the right of MyApp.Mobile, click on the target framework to select net7.0-ios | Debug
Then, to the right of the target framework, select the device to debug with. You will need to connect an iOS device, or use an existing iOS simulator.
Finally, in the debugger side menu, select the Uno Platform Mobile profile
Either press F5 or press the green arrow
Tip
When deploying to an iOS device, you may encounter the following error: errSecInternalComponent. In such case, you'll need to unlock your keychain from a terminal inside VS Code by running the following command: security unlock-keychain
Note
Debugging for Mac Catalyst is only possible when running locally (or remotely through Remote SSH) on a macOS machine.
In the status bar, select the MyApp.Mobile project - by default MyApp.sln is selected.
To the right of MyApp.Mobile, click on the target framework to select net7.0-maccatalyst | Debug
Finally, in the debugger side menu, select the Uno t Mobile profile
Either press F5 or press the green arrow to start the debugging session.
You're all set, and don't forget to take a look at our Hot Reload feature!
You can also find additional VS Code topics, such as using snippets, updating existing apps to use VS Code
Explore
Next, explore the Uno Platform App solution structure.
Troubleshoot Issues
You may encounter issues while developing your app. Please see Common Issues we have documented.
Next Steps
Now that you have built your first application, you can head to our tutorials on how to work on your Uno Platform app.