admin管理员组

文章数量:1392101

Is there a way to build a VUE 3 app once and deploy to different locations or subdirectories? For background what I'm trying to do is have an ASP.NET Core MVC app run and in one of the routes I want to have a vue app hosted inside my MVC page with the heading and nav provided by the razor layout. I've gotten most of the pieces working, but there is a final piece where something in the build is generating it's own links at run-time in the <head> for stylesheets and modules that have incorrect paths:

<link rel="modulepreload" as="script" crossorigin="" href="/dist/assets/AboutView-DUrvszN_.js">
<link rel="stylesheet" crossorigin="" href="/assets/dist/AboutView-CSIvawM9.css">

What I currently do is build the vue project and copy the dist folder to the wwwroot directory. I can get this to work running locally in Visual Studio if I add a base property to vite.config.ts:

base: '/dist/'

When I deploy to the server however, it is in a virtual application 'VueTest' in IIS. If I change the base in vite.config.ts to /VueTest/dist/ it works, but I don't want to have to rebuild.

Is there a way to set this at runtime? I've thought about changing that to some string like 'REPLACE_ME' and doing it at runtime. I've spent time getting other things to work. For example in my controller action I use HttpContext.Request.PathBase for use in loading the index js and css in the razor view. I also inject IWebHostEnvironment and use WebRootPath to find the names with hashes for index-*.js and index-*.css. I also set a ViewData property and set a property on the window object in the razor view so my router can use it. This works great with createWebHashHistory and allows deep-linking into the vue app router.

I want to use the exact same build so that dev/test/and prod all use the same build and to make it easy if we want to host in a different virtual directory. It just doesn't seem like it's the build's problem where it is hosted. If I work with a version locally by debugging at https://localhost:7077/ in Visual Studio, I don't want to create three different builds because deploying to dev, test, and prod all have different paths. (, , and

Is there a way to accomplish what I want, or am I stuck creating different builds for each place I want to deploy to?

本文标签: vuejs3How do you change vue base path at runtimeStack Overflow