VS 2022 hot reload #9527

ugurkepler created 16 days ago

Dear Volosoft Support Team,

We have created an ABP MVC Razor Pages project using the layered monolith architecture and have been actively developing it by adding various modules. Within the web modules of these components, I frequently make changes under the Pages folder—this includes modifications to JavaScript, CSS, and CSHTML files.

However, these changes are not being picked up or applied by Hot Reload. From my experience, it seems that the issue stems from these files being embedded in the project, preventing them from being properly tracked by dotnet watch. Even if they are being tracked, the changes do not reflect in the running application unless I manually restart the project.

This situation requires me to restart the application for every small change, which significantly disrupts the development experience.

I have tried enabling EnableRazorRuntimeCompilationOnDevelopment and also extended the file watch group using the following configuration:

<ItemGroup> <Watch Include=".js" Exclude="node_modules\;.js.map;obj\;bin\*" /> </ItemGroup> Unfortunately, neither of these attempts have resolved the issue. I have also tried several other approaches, but I have been unable to get Hot Reload to work as expected.

Could you please assist me in resolving this problem?

Best regards,

AI-Bot created 16 days ago

Support Team ABP Agent

To enable Hot Reload for Razor Pages, JavaScript, and CSS files in ABP MVC projects using the layered monolith architecture, you need to ensure that your application uses the physical files during development instead of the embedded resources. By default, ABP modules embed static and Razor files into assemblies, which prevents Hot Reload and file watchers from detecting changes.

ABP provides a solution for this scenario using the ReplaceEmbeddedByPhysical method in the Virtual File System configuration. This allows your application to use the physical files from the module project during development, so changes are immediately reflected without restarting the application.

Here’s how to configure it:

In your web project’s module (e.g., MyWebAppModule), update the ConfigureServices method:

[DependsOn(typeof(MyModule))]
public class MyWebAppModule : AbpModule
{
    public override void ConfigureServices(ServiceConfigurationContext context)
    {
        var hostingEnvironment = context.Services.GetHostingEnvironment();
        if (hostingEnvironment.IsDevelopment()) // Only for development time
        {
            Configure<AbpVirtualFileSystemOptions>(options =>
            {
                options.FileSets.ReplaceEmbeddedByPhysical<MyModule>(
                    Path.Combine(
                        hostingEnvironment.ContentRootPath,
                        $"..{Path.DirectorySeparatorChar}MyModuleProject"
                    )
                );
            });
        }
    }
}

Replace MyModule and MyModuleProject with your actual module class and project folder name.

This configuration ensures that during development, changes to .cshtml, .js, and .css files in your module’s Pages folder are served directly from disk, enabling Hot Reload and immediate feedback.
No need to restart the application for every change—just refresh the browser.

This approach is already used in ABP’s application startup templates for localization files and is the recommended way to improve the development experience with embedded resources.

Sources

ABP Virtual File System: Working with Embedded Files During Development

This response was generated by AI. If it didn’t solve your problem, feel free to post a new answer — our support team will jump in to help you soon.