V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
ecloud
V2EX  ›  Vue.js

Vue3+Vite 服务器连接地址打包后配置怎么搞?

  •  
  •   ecloud ·
    yecloud · 2022-07-18 14:58:17 +08:00 · 2640 次点击
    这是一个创建于 850 天前的主题,其中的信息可能已经有所发展或是发生改变。

    帮我们组前端问的

    16 条回复    2022-08-16 10:45:31 +08:00
    lizhisty
        1
    lizhisty  
       2022-07-18 14:59:56 +08:00
    让他自己问
    f056917
        2
    f056917  
       2022-07-18 15:08:27 +08:00
    服务器地址不是放到项目配置里面的吗,根据项目环境打包
    gzlock
        3
    gzlock  
       2022-07-18 15:08:36 +08:00
    都是用相对路径的吧
    f056917
        4
    f056917  
       2022-07-18 15:09:33 +08:00
    或者打包的时候不要把服务器地址打包进去,后端在服务器上开个 nginx 代理
    ecloud
        5
    ecloud  
    OP
       2022-07-18 15:20:16 +08:00
    @lizhisty 他不会翻墙😂
    Vegetable
        6
    Vegetable  
       2022-07-18 15:31:48 +08:00
    JimmyB
        7
    JimmyB  
       2022-07-18 15:44:09 +08:00
    代码里根据不同的环境变量设置不同的 API BASE URL 。
    和技术栈没关系。
    ecloud
        8
    ecloud  
    OP
       2022-07-18 15:53:16 +08:00
    @JimmyB 似乎是有点关系的,以前在 vue2 上的方法现在行不通了
    ecloud
        9
    ecloud  
    OP
       2022-07-18 15:56:25 +08:00
    @f056917 #4 这也没有,你的意思是服务器地址写前端机:port ,然后前端机转发这个到真正的后端机。实际上现在就是这么做的,但是这样的话当前端机 ip 变换的话,还是要重新打包。这是个内网应用,前端机还没 dnsname
    novaeye
        10
    novaeye  
       2022-07-18 15:58:00 +08:00
    https://github.com/chenxch/vite-plugin-dynamic-base
    这个 vite 插件配合 nginx ssi 可以帮到你
    thinkershare
        11
    thinkershare  
       2022-07-18 16:05:20 +08:00
    @ecloud 配相对地址, 前端和后端部署在一起
    gouflv
        12
    gouflv  
       2022-07-18 16:40:26 +08:00 via iPhone
    说句难听的,像这种没法独立解决问题的开发,不管帮几次都是没用的
    rbq123456
        13
    rbq123456  
       2022-07-18 18:58:21 +08:00
    1.createHtmlPlugin 注入
    2.npm run build 命令里面注入
    babyoung
        14
    babyoung  
       2022-07-18 20:13:03 +08:00
    ztc
        15
    ztc  
       2022-08-15 10:22:20 +08:00
    我做过 -> 在 public 文件夹底下新建一个公共 js 文件,配置 axios 请求地址、超时时间等
    gausszhou
        16
    gausszhou  
       2022-08-16 10:45:31 +08:00
    1. 直接用域名
    2. 打包时修改, 使用 .env.production 或者 corss-env 配置
    3. 打包后修改:在 public 文件写一个 config.js ,直接 在 index.html 中引入
    4. 部署时修改:前端单独部署 docker ,在 docker 内的 nginx 中进行配置代理
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1049 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 25ms · UTC 20:30 · PVG 04:30 · LAX 12:30 · JFK 15:30
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.