现在超图服务地址支持打包后通过外部配置文件修改,无需重新打包即可适配不同的部署环境。
打包后的配置文件位于:dist/supermap.config.js
npm run build:prod
打包后会在 dist 目录生成 supermap.config.js 文件。
环境A部署:
编辑 dist/supermap.config.js:
window.SUPERMAP_CONFIG = {
host: '192.168.1.100',
port: '8090'
}
环境B部署:
编辑 dist/supermap.config.js:
window.SUPERMAP_CONFIG = {
host: '192.168.2.200',
port: '8090'
}
启动应用后,浏览器控制台会显示:
超图服务配置: { source: "外部配置文件", host: "192.168.1.100", port: "8090", baseUrl: "http://192.168.1.100:8090" }
| 配置项 | 说明 | 示例 |
|---|---|---|
host |
超图服务器地址 | '192.168.1.100' |
port |
超图服务器端口 | '8090' |
baseUrl |
完整地址(可选) | 'http://192.168.1.100:8090' |
tiandituKey |
天地图Key(可选) | 'your_key' |
supermap.config.js) - 最高优先级.env.production)localhost:8090)window.SUPERMAP_CONFIG = {
host: '192.168.1.100',
port: '8090'
}
window.SUPERMAP_CONFIG = {
baseUrl: 'http://supermap.example.com:8090'
}
window.SUPERMAP_CONFIG = {
baseUrl: 'https://supermap.example.com'
}
public/supermap.config.jsdist/supermap.config.jsindex.html 在同一目录如果修改配置后未生效,可能是浏览器缓存:
?v=时间戳确保Web服务器有读取 supermap.config.js 的权限:
chmod 644 supermap.config.js# 1. 打包
npm run build:prod
# 2. 部署到服务器
scp -r dist/* user@server:/var/www/html/
# 3. 登录服务器
ssh user@server
# 4. 修改配置
vi /var/www/html/supermap.config.js
# 5. 重启Web服务器(可选)
systemctl restart nginx
部署脚本示例:
#!/bin/bash
# deploy.sh
ENV=$1
if [ "$ENV" == "prod" ]; then
HOST="192.168.1.100"
elif [ "$ENV" == "test" ]; then
HOST="192.168.2.200"
else
HOST="localhost"
fi
# 修改配置文件
sed -i "s/host: '.*'/host: '$HOST'/" dist/supermap.config.js
# 部署
rsync -avz dist/ user@server:/var/www/html/
使用:
./deploy.sh prod # 部署到生产环境
./deploy.sh test # 部署到测试环境
检查步骤:
检查:
如果超图服务器与应用不在同一域名,需要:
开发环境默认使用 public/supermap.config.js,可以修改此文件进行本地测试。
也可以使用 .env.development 配:
VITE_SUPERMAP_HOST=localhost
VITE_SUPERMAP_PORT=8090
通过外部配置文件,您现在可以: