ViewComponent tag helpers not working

Question

I have updated my asp.net core web application from 1.0.1 to 1.1.0, but tag helpers for my viewcomponents are not working:

<vc:login-form />

it outputs the tag. It works using old syntax: @await Component.InvokeAsync(typeof(LoginFormViewComponent))

What am I missing?

package.json:

{
  "title": "DevPortal.Web",
  "version": "0.1.0",
  "language": "",
  "dependencies": {
    "Microsoft.NETCore.App": {
      "version": "1.1.0",
      "type": "platform"
    },
    "Microsoft.AspNetCore.StaticFiles": "1.1.0",
    "Microsoft.AspNetCore.Server.IISIntegration": "1.1.0",
    "Microsoft.AspNetCore.Server.Kestrel": "1.1.0",
    "Microsoft.AspNetCore.Mvc": "1.1.0",
    "NuGet.CommandLine": "3.5.0",
  },

  "tools": {
    "Microsoft.AspNetCore.Server.IISIntegration.Tools": "1.0.0-preview2-final",
    "Microsoft.AspNetCore.Razor.Tools": "1.1.0-preview4-final"
  },

  "frameworks": {
    "netcoreapp1.1": {
      "imports": [
        "dotnet5.6",
        "portable-net45+win8"
      ]
    }
  },

  "buildOptions": {
    "emitEntryPoint": true,
    "preserveCompilationContext": true
  },

  "runtimeOptions": {
    "configProperties": {
      "System.GC.Server": true
    }
  },

  "scripts": {
    "prepublish": [ "bower install"],
    "postpublish": [ "dotnet publish-iis --publish-folder %publish:OutputPath% --framework %publish:FullTargetFramework%" ]
  },
  "userSecretsId": "aspnet-DevPortal.Web-20161230052130"
}

I have added this to _ViewImports.cshtml:

@addTagHelper "*, DevPortal"

and my assembly name is DevPortal.dll

[ViewComponent(Name ="LoginForm")]
public class LoginFormViewComponent: ViewComponent
{
    public IViewComponentResult Invoke(LoginFormViewModel model = null)
    {
        if (model == null) model = new LoginFormViewModel();
        return View(model);
    }
}

Answer 1

In this case, problem was also with the parameter with default value. This issue us being tracked on github, but currently ViewComponents cannot have parameters with default values

This should work:

<vc:login-form model="null" />    

Answer 2

I have an ASP.NET Core 5.0 Web Application. I faced same issue, but I resolved this issue.

For example:

If my project's name is MyProject and my view components located at Components folder, I added below code to _ViewImport.cshtml and it is working for me

 @addTagHelper *, MyProject  

For more details, you can see this video: Kudvenkat - ASP NET Core view component tag helper

Answer 3

Everyone still having issues with that ViewComponents using <vc:my-view-component /> TagHelpers, it can happen also if you don't use correct minus/hyphens in attribute names.

For example, if you have an Invoke method with these parameters in camelCase:

public IViewComponentResult Invoke(int itemCount, bool showActions)

This will NOT work:

<vc:product-list itemCount="5" showActions="false" />

✅ This will work:

<vc:product-list item-count="5" show-actions="false" />

Answer 4

Old question, but had the same issue.

As per this link, it seems _ViewImports or _GlobalImports isn't automatically applied inside ViewComponents. Try adding the @addTagHelper line in the ViewComponent View.