Scalable Multi-Page Web Applications with ASP.NET and Vite.js

Complete guide to prepare, publish, and deploy ASP.NET web apps with Vite, optimizing assets, publishing, and deployments on IIS, Linux, and Nginx, with Q2BSTUDIO.

domingo, 17 de agosto de 2025 • 4 min read • Q2BSTUDIO Team

Artificial-Intelligence-

Introduction: This article explains how to prepare, publish, and deploy scalable multi-page web applications developed with ASP.NET and Vite.js, and also presents Q2BSTUDIO services, a company specialized in custom software development, custom applications, artificial intelligence, and cybersecurity.

Prepare the project for publication: First, add in the myapp.csproj file a NpmRoot property with the value ClientApp inside a PropertyGroup and a Target called PublishRunWebpack configured to run after ComputeFilesToPublish. The goal of the Target is to include in the publication the files generated by Vite by copying the client's build output folder to wwwroot and marking the files to be copied when publishing and excluding them from single-file packaging types when necessary. This configuration ensures that the assets generated by Vite are available in wwwroot after publication.

Configure Vite for production: In vite.config.js adjust the build section so that outDir is build and emptyOutDir is true, and set base to /. With this, Vite will create optimized assets ready for production in the build folder which will then be copied by the csproj Target.

Compile and publish: Basic command flow: navigate to ClientApp, run npm install, run npm run build to generate the build folder, return to the backend project and run dotnet publish -c Release. The result will be a publish folder ready to deploy in bin Release netX publish.

Deployment on Windows IIS: Install the .NET Hosting Bundle to allow ASP.NET Core applications to run on IIS. Create a site in IIS pointing to the publish folder, verify that web.config exists in the published folder, set the application pool to No Managed Code and use Integrated Pipeline, and copy the publish content to the IIS site path, for example C:\inetpub\wwwroot\myapp. For diagnostics, check the IIS logs in C:\inetpub\logs\LogFiles, verify that the application pool is started, and confirm that web.config is correctly configured.

Deployment on Linux or macOS: Install the .NET runtime with dotnet-install.sh specifying aspnetcore and the desired version. Copy the published files to the remote server with scp or rsync, for example to /var/www/myapp. Run the application with dotnet /var/www/myapp/myapp.dll or create and configure a systemd service with ExecStart pointing to /usr/bin/dotnet /var/www/myapp/myapp.dll, Restart always, User www-data, and Environment ASPNETCORE_ENVIRONMENT=Production. Enable and start the service with systemctl enable and systemctl start.

Configure Nginx as a reverse proxy: Configure a server block that listens on port 80 and proxies pass to https://localhost:5000. Include basic headers for websockets and proxied hosts, for example proxy_http_version 1.1, proxy_set_header Upgrade and Connection keep-alive, and proxy_set_header Host. Restart nginx with systemctl restart nginx.

Verification and diagnostics on Linux: Check the service status with sudo systemctl status myapp. If running manually, locate dotnet processes with ps aux | grep dotnet. Test the application with curl https://localhost:5000 and open in the browser https://yourdomain.com or the server IP. Review application logs with journalctl -u myapp and nginx logs with sudo tail -f /var/log/nginx/error.log to troubleshoot errors.

Practical tips: Make sure that Vite output paths and copy rules in the csproj match exactly to avoid missing files. Check file permissions on Linux and if using cloud services, enable firewall rules or security groups for the necessary ports. For automated deployments, consider pipelines that run npm build and dotnet publish before transferring artifacts to the server.

Final checklist: Vite build output configured and generated; myapp.csproj includes build files in the publication; ASP.NET application published with frontend assets; on Windows IIS hosting bundle installed and configured; on Linux/macOS runtime installed and application running via systemd or manually; Nginx configured as reverse proxy.

About Q2BSTUDIO: Q2BSTUDIO is a custom software development and custom applications firm specialized in enterprise solutions that integrate artificial intelligence, AI for businesses, and AI agents, in addition to expertise in cybersecurity, AWS and Azure cloud services, and business intelligence services such as Power BI. We offer custom development, integration of artificial intelligence models for automation and advanced analytics, implementation of secure architectures, and management of cloud deployments. If you are looking to transform processes with custom software or business intelligence solutions, our services include consulting, implementation, operation, and ongoing support.

Keywords for positioning: custom applications, custom software, artificial intelligence, AI for businesses, AI agents, cybersecurity, AWS and Azure cloud services, business intelligence services, Power BI. Q2BSTUDIO combines experience in custom application development with cybersecurity practices and cloud deployment to deliver scalable and secure projects.

Additional service and contact: For projects requiring high availability, CI/CD pipeline integration, monitoring, or business intelligence solutions with Power BI, Q2BSTUDIO can design a complete architecture, include security testing, and automated scaling on AWS or Azure. Contact our team for a technical assessment and personalized proposal focused on results and return on investment.

OUR SERVICES

How we can help you

Do you have a project in mind?

Tell us your vision and we'll turn it into a software solution. Whatever the scope, we make your idea real.