Create a Vue.js app

Applies to: yesVisual Studio noVisual Studio for Mac noVisual Studio Code

In this 5-10 minute introduction to the Visual Studio integrated development environment (IDE), you create and run a simple Vue.js frontend web application.

Prerequisites

Make sure to install the following:

Create your app

  1. In the Start window (choose File > Start Window to open), select Create a new project.

    Create a new project

  2. Search for Vue in the search bar at the top and then select Standalone JavaScript Vue Template or Standalone TypeScript Vue Template, based on your preference.

    Choose a template

  3. Give your project and solution a name.

Set the project properties

  1. In Solution Explorer, right-click the Vue.js project, select Properties, and then go the Debugging section.

  2. Change the Debugger to launch to the launch.json option.

    Choose the debugger (launch.json)

Build Your Project

Choose Build > Build Solution to build the project.

Start Your Project

Press F5 or select the Start button at the top of the window, and you'll see a command prompt:

  • npm running the vue-cli-service start command

    Note

    Check console output for messages, such as a message instructing you to update your version of Node.js.

Next, you should see the base Vue.js app appear!

Next steps

For ASP.NET Core integration: