I’ve been working with NopCommerce plugins for a while now, and for a long time I never really used Razor (at least not its intellisense). Don’t get me wrong, I think Razor is awesome and I use it when I can, but by default Razor intellisense simply doesn’t work in NopCommerce plugin projects. I saw a lot of people out there with the same problem and decided to get to the bottom of it. After all, it’s a huge productivity barrier to not have full Razor support in larger projects.
It turns out this isn’t really a NopCommerce issue, but rather a Visual Studio issue. It simply surfaces in Nop projects because of the choice to make plugins class libraries and not MVC projects or Areas. Outside of NopCommerce I’ve never actually ran into a situation where i wanted to use Razor in a non MVC project, at first I thought it was a NopCommerce architecture issue. However, the real problem is simply that Razor intellisense is not supported in class library projects.
There is a fairly easy way to fix this, though it feels a bit hacky. I have seen various instructions out there for how to fix this issue – none of them worked for me so I pieced together these steps. Here is what you do:
Create a new class library project under the NopCommerce Plugins folder like you normally would. When creating the plugin project, make sure to choose the top level NopCommerce Plugins directory for its location (for me the default is the root of NopCommerce, which is incorrect). For this tutorial we’ll call the project Nop.Plugin.Misc.RazorTest.
Add the following references from the Libraries folder in your NopCommerce installation:
- System.Web.Mvc
- System.Web.Razor
- System.Web.WebPages
- System.WebPages.Razor
- Nop.Data
- Nop.Web
- Nop.Web.Framework
- Nop.Service
The Nop references are optional for this tutorial, but most meaningful plugins use the Nop DLL’s in some way.
Delete the Class1.cs file that Visual Studio creates and add a new folder called Views to your project. Inside of it add a new Razor file. Since this is a class library there is no option to add a view directly, so just say Add New Item, choose a text file and name it Hello.cshtml.
Copy the web.config file from any other plugin project into your own project. I have seen some attempts to fix this Razor problem using highly modified web.config files. This is not necessary in my experience, just use a standard Nop plugin web.config.
Next, open up the properties of your project and change the platform to .NET Framework 4.5.1 or whatever platform your version of Nop uses. Also, under the Build menu item on the left, change the output path for All Releases to “bin\”. Save your changes.
Right click on your plugin project and choose “Unload Project”. Then right click on the inactive project node and choose to edit the csproj file.
Add this node to your project beneath the existing “ProjectGuid” node near the top. This will tell Visual Studio to treat the project type like an MVC project – I copied this new node out of another MVC project. It should look like the image below when you’re done, though your own original ProjectGuid will be different.
<ProjectTypeGuids>{349c5851-65df-11da-9384-00065b846f21};{fae04ec0-301f-11d3-bf4b-00c04f79efbc}</ProjectTypeGuids>
Next, add this import node at the bottom of your csproj file below the other import node for CSharp.targets. This will import some of the necessary Visual Studio tooling for web applications and razor, though I don’t know the specifics of what goes on behind the scenes. Leave a comment if you do! Again, use the image as reference.
<Import Project="$(VSToolsPath)\WebApplications\Microsoft.WebApplication.targets" Condition="'$(VSToolsPath)' != ''" />
Save your changes, and then right click on the project node to reload the project.
Clean and build your project.
Make sure Hello.cshtml is closed and then open it back up to reload it. Type @Html.ActionLink() – as you type you should now be prompted for intellisense!!
Do NOT rebuild or clean your project – instead open up the project properties again. Change the output path to where it should be for Nop, something like “..\..\Presentation\Nop.Web\Plugins\Misc.RazorTest\”. Now when you clean and build your project it will build to the proper plugins directory in NopCommerce. Since you didn’t clean or rebuild before this step, the DLL’s you compiled previously into the bin folder will still be around to help out intellisense.
Your plugin should now work like a hybrid of an MVC project and a regular NopCommerce plugin. This has worked for me every time, hope it works for you!
