这可以在运行时动态配置 vue-cli 中的 publicPath 吗？答案

【问题标题】：Is this possible to configure publicPath in vue-cli dynamically in runtime?这可以在运行时动态配置 vue-cli 中的 publicPath 吗？
【发布时间】：2019-09-21 03:11:24
【问题描述】：

这是否可以动态更改 vue 应用程序的 publicPath（在 vue.config 中）？这意味着我想将公共路径设置为动态取决于真实 url（某些域），例如我只想制作一个版本，但将其用于登台和生产环境（并对不同国家/地区的资产使用不同的 cdn-s 等）。我发现 webpack_public_path 旨在在运行时设置公共路径。但是如何将 webpack_public_path 与 vueJS(vue-cli) 一起使用？

webpack_public_path - 对我不起作用。也许有人可以在 repo 中提供一个真实的例子？

预期结果：如果我在“生产”模式下构建一次应用程序，在多个环境中部署（工件）应用程序，每个环境在运行时（cdn）设置自己的 publicPath。例如。对于欧洲域 test.com 上的产品工件 - 使用 cdn：test-cdn-europe.com，对于 test.ua - 使用 another-test-cdn.ua 等等。但我想在运行时更改 vue.config 中的这个 publicPath（可能基于当前域或类似的东西）。所以我只能进行一次构建（因为可能需要太多时间 - 进行多次构建）。

您能提出解决此问题的任何想法吗？谢谢！

【问题讨论】：

标签： vue.js webpack vue-cli

【解决方案1】：

您可以为__webpack_public_path__ 分配一个新值，但您必须在应用程序本身启动之前这样做。

所以最好是把它放到自己的文件中，然后在 Vue 之前导入：

import './publicpath'
import Vue from 'vue'

然后在publicpath.js你会做这样的事情：

__webpack_public_path__ = window.your_public_path

你当然也可以使用 window.location 来获取域名或其他东西

【讨论】：

这适用于客户端，但我不知道如何让服务器端正常工作，有什么想法吗？
我不确定您所说的“服务器端”是什么，尤其是因为您不是 OP，而且我对您的情况一无所知。
我有同样的问题，我不知道如何解决。只有当我在开发环境中访问我的 vue 应用程序时，您的解决方案才对我有效——当我使用 vue-cli 使用“npm run serve”时。但是当我构建我的 vue 项目并使用 spring boot 服务器提供 index.html 文件时，动态公共路径根本不起作用。例如，我需要从 /instance1/assets 访问资产文件，并从同一个编译的 vue 项目访问 /instance2/assets。但是从 Spring Boot 服务器提供 index.html 时它不起作用。
在运行时更改 __webpack_public_path__ 可能还不够。如果您有兴趣，可以阅读我对这个问题的看法here