Update: Using Vue 3 Components in ASP.NET Core without bundler

5 min readDec 26, 2021


An update to my article about using Vue.js Components in ASP.NET Core Web Application without JavaScript bundler

This is the long promised update to my article “Using Vue Components in ASP.NET Core without bundler”.

ASP.NET Core + Vue 3

This year I have migrated my projects to Vue 3 and now, I am glad to share with you my experience of upgrading Vue 2 code.

The migration was rather simple and there is not too much to write about. But since there were several requests to write an update with Vue 3, I am doing it now. :-)


Vue 3 has a list of breaking changes you have to deal with. I will cover here only some of them. Please check the official Vue.js Migration Guide for further details.

Vue.js: Migration from Vue 2 Guide

1. New app instance concept with createApp

Vue 3 has changed the way you create the app instance (A New Global API: createApp)

In Vue 2 we have used new Vue({}) to create a new instance of Vue

In Vue 3 you must use the createApp method to create a new app instance

I still don’t have any JavaScript Bundler in my projects, and use a CDN build of Vue. In this case the method createApp is exposed via the global Vue object:

Or we can just directly use the Vue.createApp()method like this

const app = Vue.createApp({})

You can use the same way of initializing for other Vue 3 methods including the Compositions APU methods like ref, computed, watch and etc.

2. Data is now always a function

Vue 2 has different ways of declaring data for the root instance and components.

The root instance has an object directly in the data property:

For Vue 2 components data must be a function:




Born, Learned, Studied, Coding…