Base Components

Is this part of VueJs?

No, this is not part of VueJs. This is simply to facilitate the VueJs integration if you want to build a quick PoC.

What is a Base Component?

That's a good question. In this case, we call the base component not a component that is used for composition of object (programming language). Here, we're talking about components that are going to be used and re-used all across your application.

Why should I use Base Component?

The usage of the base components avoid you doing monkey typing. This also allow you to have always the same name for your general use component.

For example, the icon and page-title components are base components, or what we could call a base components. You see that we don't need to use any import or require and also no need to add the component in the export default from the Vue file.

Oh, cool! I want to use it, how do I do my own?

There's a hidden, or not so visible feature implemented in the ClientApp/app.js file. Any component starting with base is going to be marked as a base component. For example basePageTitle.vue will provide you the tag <page-title ... /> across the application (VueJs). The name of the component will be automatically generated like the following:

1. Remove the base text
2. Separate using Capitals letters and then add an hyphen
3. Put everything in lower-case

Important: That feature is enabled ONLY for the files found within the folders and sub-folders of ClientApp\components\.

Fine, but I don't need that, how to disable?

It's legit to asks how to disable. It's quite simple. Simply open the app.js located within your ClientApp folder. There, you will see some JavaScript searching for any component starting with base (RegEx). Simply remove that code, or adapt to your need.