创建config.js具有所需配置的文件。我们将在以后使用它来创建一个配置映射，并将其部署到Kubernetes。将其放入其他JavaScript文件所在的Vue.js项目中。尽管稍后我们将其排除在最小化之外，但将其保留在此处很有用，以便IDE工具可以使用它。
const config = (() => {
return {
"VUE_APP_ENV_MyURL": "...",
};
})();
现在，请确保您的脚本已排除在缩小之外。为此，请使用以下内容创建文件vue.config.js，以保留我们的配置文件。
const path = require("path");
module.exports = {
publicPath: '/',
configureWebpack: {
module: {
rules: [
{
test: /config.*config\.js$/,
use: [
{
loader: 'file-loader',
options: {
name: 'config.js'
},
}
]
}
]
}
}
}
在index.html中，添加脚本块以手动加载配置文件。请注意，配置文件将不存在，因为我们只是将其排除在外。稍后，我们将其从中装入ConfigMap到我们的容器中。在此示例中，我们假设将其安装到与HTML文档相同的目录中。
<script src="config.js"></script>
更改代码以使用我们的运行时配置：
this.displayURL = config.VUE_APP_ENV_MyURL || process.env.VUE_APP_ENV_MyURL
在Kubernetes中，创建一个使用配置文件内容的配置映射。当然，您想从配置文件中读取内容。
apiVersion: v1
kind: ConfigMap
Metadata:
...
data:
config.js: |
var config = (() => {
return {
"VUE_APP_ENV_MyURL": "...",
};
})();
在您的部署中引用配置映射。这会将配置映射作为文件安装到您的容器中。在mountPath已经包含了我们的minified的index.html的。我们挂载我们之前引用的配置文件。
apiVersion: apps/v1
kind: Deployment
Metadata:
...
spec:
...
template:
...
spec:
volumes:
- name: config-volume
configMap:
name: ...
containers:
- ...
volumeMounts:
- name: config-volume
mountPath: /usr/share/Nginx/html/config.js
subPath: config.js
现在，您可以在处访问配置文件，<Base URL>/config.js并且应该看到放入ConfigMap条目中的确切内容。您的HTML文档会加载该配置映射，同时会加载其余的缩小的Vue.js代码。瞧！
602392714
清零编程群