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

vue3 静态化问题请教

  •  
  •   kernel365 · 2022-08-01 01:22:46 +08:00 via Android · 2084 次点击
    这是一个创建于 846 天前的主题,其中的信息可能已经有所发展或是发生改变。
    各位大佬好,

    最近在做一个多语言多域名的 vue3 前端项目。页面也不多。

    第一版用的是传统的开发方式,浏览器端渲染,判断域名,vuevu-i18n 载入特定的语言。 (一个域名只有一个语言)。

    项目本身也不大,但是 chrome lighthouse 看到载入时间很不理想。同时网站有些面向谷歌 seo 的需求。

    所以下一版实现,就想怎么静态化一下,sSG(优先考虑)或者 SSR 。但是我们这里是依赖域名来判断语言,导致我们无法提前知道语言包,无法提前静态化。

    特来向各位大佬求助。


    另外一个角度就是,先生成 html ,然后以静态文件的方式 serve 但是怎么样 让不同域名打开不同的 html 呢?

    语言有 20+  一个域名配一套 html 有点麻烦,想让他们共用一套或个位数套代码。
    6 条回复    2022-08-01 16:08:43 +08:00
    hronro
        1
    hronro  
       2022-08-01 06:59:32 +08:00 via iPhone
    根据不同域名载入不同页面,这个是 nginx 最基本的功能了吧
    vivipure
        2
    vivipure  
       2022-08-01 09:07:55 +08:00
    感觉可以通过 SSG 打包一份就 ok 了,将所有的域名都指向构建好的页面。在 JS 中写逻辑,根据域名加载语言包。
    9ki
        3
    9ki  
       2022-08-01 09:09:39 +08:00
    nextjs (React 的 SSR 框架) 是原生支持楼主说的功能的, vue 的话可以试试 https://i18n.nuxtjs.org/
    snoopyhai
        4
    snoopyhai  
       2022-08-01 09:11:50 +08:00
    如果没记错:
    vue-i18n 是 url 保持不变, 更换语言包
    而 nuxt 中的 i18n 插件.是每种语言有一个独立的 url. 比如默认: abc.com/index; 英文: abc.com/en/index;
    既有静态化的需求, 又有多语言的需求. 试试 nuxt?
    duan602728596
        5
    duan602728596  
       2022-08-01 10:56:31 +08:00
    可以根据 ip 提前知道位置吧
    ragnaroks
        6
    ragnaroks  
       2022-08-01 16:08:43 +08:00
    SSG 将所有 locale 加载并使用一个默认 locale ,显示一个加载组件,通过脚本判断域名后执行更新操作,隐藏加载组件
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   950 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 22:38 · PVG 06:38 · LAX 14:38 · JFK 17:38
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.