经验首页 前端设计 程序设计 Java相关 移动开发 数据库/运维 软件/图像 大数据/云计算 其他经验
当前位置:技术经验 » JS/JS库/框架 » JavaScript » 查看文章
同一个域名下部署多个前端项目,修改vue-cli 环境变量BASE_URL
来源:cnblogs  作者:Jade_g  时间:2021/5/10 18:53:20  对本文有异议

公司让用vue重构一个angular项目,需要可以在新旧版本间切换,慢慢过渡到只用新版本。

查询Nginx配置,得知

想要在同一个域名下部署多个前端项目,通过不同url来区分调用相应前端项目。
比如:部署项目a,项目b。想要效果如下。
浏览器输入:http://localhost:8082/a/,展示项目a。
浏览器输入:http://localhost:8082/b/,展示项目b。

这样两版共用一个域名,那么这个域名下的cookie等登陆信息就可以共用了,切换版本不用重新登录。

具体配置

  1. location /a/ {
  2. alias html/app/;
  3. index index.html index.htm;
  4. try_files $uri $uri/ /app/index.html;
  5. }
  6. location /b/ {
  7. alias html/pc/;
  8. index index.html index.htm;
  9. try_files $uri $uri/ /pc/index.html;
  10. }

vue router:相关配置

base

  • 类型: string

  • 默认值: "/"

    应用的基路径。例如,如果整个单页应用服务在 /app/ 下,然后 base 就应该设为 "/app/"

  1. base: process.env.BASE_URL,

上面代码是vue-cli自动生成的配置,看到这里我就想修改BASE_URL,通过新建.env环境变量文件

环境变量

你可以在你的项目根目录中放置下列文件来指定环境变量:

  1. .env # 在所有的环境中被载入

    只有 NODE_ENVBASE_URL 和以 VUE_APP_ 开头的变量将通过 webpack.DefinePlugin 静态地嵌入到客户端侧的代码中

 然后我在.env中修改BASE_URL,完全不起作用,随意设个VUE_APP_的变量是可以实现的,后来我发现了下面这段话,试着只修改vue.config.js 中的 publicPath

  • BASE_URL - 会和 vue.config.js 中的 publicPath 选项相符,即你的应用会部署到的基础路径

vue-cli配置

publicPath

  • Type: string

  • Default: '/'

默认情况下,Vue CLI 会假设你的应用是被部署在一个域名的根路径上,例如 https://www.my-app.com/。如果应用被部署在一个子路径上,你就需要用这个选项指定这个子路径。例如,如果你的应用被部署在 https://www.my-app.com/my-app/,则设置 publicPath 为 /my-app/

修改vue.config.js 中的 publicPath后,得以实现配置服务的基路径。

原文链接:http://www.cnblogs.com/gxp69/p/14751695.html

 友情链接:直通硅谷  点职佳  北美留学生论坛

本站QQ群:前端 618073944 | Java 606181507 | Python 626812652 | C/C++ 612253063 | 微信 634508462 | 苹果 692586424 | C#/.net 182808419 | PHP 305140648 | 运维 608723728

W3xue 的所有内容仅供测试,对任何法律问题及风险不承担任何责任。通过使用本站内容随之而来的风险与本站无关。
关于我们  |  意见建议  |  捐助我们  |  报错有奖  |  广告合作、友情链接(目前9元/月)请联系QQ:27243702 沸活量
皖ICP备17017327号-2 皖公网安备34020702000426号