如何通过虚拟目录在IIS上部署Vue.js应用程序? [英] How to deploy Vue.js application on IIS over Virtual Directory?

问题描述

我需要在IIS上的虚拟目录上部署Vue.js应用程序，但是在部署它时，我必须更改路由以包含虚拟目录名称.

I need to deploy a Vue.js application on IIS over a virtual directory, but when I deploy it I have to change my routes to include the virtual directory name.

我原来的路线是这样的:

My original routes is like that:

export const routes = [
    { path: '', component: Default, props: true },
    { path: '/Path', component: Path, props: true },
    { path: '/Path/:IdPath', component: PathForm, props: true }
];

但是要工作，我必须更改路由以包含虚拟目录名称，如下所示:

But to work, I had to change my routes to include the virtual directory name, like that:

export const routes = [
    { path: '/VirtualDirectory', component: Default, props: true },
    { path: '/VirtualDirectory/Path', component: Path, props: true },
    { path: '/VirtualDirectory/Path/:IdPath', component: PathForm, props: true }
];

这是一个问题，因为如果我需要更改服务器或虚拟目录，则必须重新部署Vue.js应用程序以包括新的虚拟目录名称.

And this is a problem, because if I need to change my server or my virtual directory I'll have to re-deploy my Vue.js application to include the new virtual directory name.

有没有办法使这种动感?

Are there a way to make this dinamic?

推荐答案

您将需要配置 publicPath ，默认情况下，此设置为"/"，例如如果您查看生成的index.html，将会看到:

You will need to configure the publicPath, by default this is set to "/", e.g. if you look in your generated index.html you will see:

  <script type="text/javascript" src="/app.js"></script></body>

注意上面的"/app.js".

Notice the "/app.js" above.

您可以通过在项目的根目录中添加 vue.config.js 文件并添加 publicPath 设置来进行配置:

You can configure this by adding a vue.config.js file to the root of your project and adding a publicPath setting:

module.exports = {
   publicPath: '/my-virtual-directory'
}

请参阅Vue官方文档 https://cli.vuejs.org/config/#publicpath 了解更多信息.

See the official Vue documentation https://cli.vuejs.org/config/#publicpath for more information.

这篇关于如何通过虚拟目录在IIS上部署Vue.js应用程序?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！