Setup Visual Studio

Install Extension

Install Visual Studio Extension Emscripten Extension Pack for Visual Studio so that Visual Studio can handle the compilation of WebGL application with EMCC (Emscripten Compiler Front-End)

Download the .vsix Package from Visual Studio Market Place1.


Execute the downloaded .vsix package, and click the Modify button in the shown window that confirms installed features.


Check that installation of Emscripten Debugger for Visual Studio and Emscripten Build Support has been completed, and click the Close button to finish setup.


Download OpenSiv3D for Web

The OpenSiv3D for Web Installer is available in the Download page. This Installer will configure following settings in your develop environment.

  • Placement of OpenSiv3D for Web Headers and Static Libraries.
  • Registration of OpenSiv3D for Web Project Template.
  • Registration Environment Variable of the Placement Path

Smart Screen may prevents launching The OpenSiv3D for Web Installer, click [detail] and [run] button will be shown.

SmartScreen1 SmartScreen2

Click the OK button in the window that selecting the language used during setup.


Select the destination folder as you like where assets are installed in, and click the Next button.


Click the Install button in the window that confirms the installation options.


The window will be shown when the installation has been completed, and click the Finish button to terminate the installation process.


Creating Project

Launch Visual Studio, click Create New Project in the Visual Studio starting window, and the list of available project templates will be shown.


Select the project template named as OpenSiv3D(0.6.0)Web, and click the Next button.


Determine the project name as you like, and click the Create button.


After determining the project name, the text editor of the source code Main.cpp will be shown. Please don’t forget to switch the project platform configuration to Emscripten (surrounded by the red rectangle in the following figure)


Registration emscripten Toolchain

Open the project configuration window, and fill Emscripten Install Folder (found in [General] > [emscripten toolchain] in Visual Studio 2017) in the project configuration with the folder that contains emcc.bat.


Next Step

Check out Writing First Code!

  1. You can also install this Extension via Extensions Manager (found in [Tools] > [Extensions…]), with searching for Emscripten Extension Pack for Visual Studio.

    setup-vs-ext-1.png VisualStudioExtensionManager0.png