Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

⬆️ chore: upgrade nextjs to 14.0.2 #467

Merged
merged 2 commits into from
Nov 16, 2023
Merged

⬆️ chore: upgrade nextjs to 14.0.2 #467

merged 2 commits into from
Nov 16, 2023

Conversation

arvinxx
Copy link
Contributor

@arvinxx arvinxx commented Nov 16, 2023

💻 变更类型 | Change Type

  • ✨ feat
  • 🐛 fix
  • ♻️ refactor
  • 💄 style
  • 🔨 chore
  • 📝 docs

🔀 变更说明 | Description of Change

升级 Nextjs 到 14.0.2,核心做了两部分变更:

  • 补充 mjs 的编译脚本,原因见下 1
  • 移除 cssinjs lib alias,原因见 2

📝 补充信息 | Additional Information

相关问题记录:

  1. 修正 shikiji 报错
    直接升级到 14.0.2 ,会报错:export 'getHighlighterCore' (reexported as 'getHighlighterCore') was not found in './core.mjs' (module has no exports)。之前没详细排查,临时锁到了14.0.1:📌 chore: lock nextjs to 14.0.1 to avoid build error #439
image

经过排查后发现是 nextjs 不支持 mjs 的编译,refs: antfu/shikiji#23 。通过添加 webpack 构建脚本解决:

  config.module.rules.push({
      test: /\.m?js$/,
      type: 'javascript/auto',
      resolve: {
        fullySpecified: false,
      },
    });
  1. 修正 antd 的引入实例问题。背景:build: update next v14 #434

antd 本身存在 es 和 lib 两个文件夹,对应两份组件实例。14.0.0 ~ 14.0.1 会将 antd 引入实例错误地锁定为 lib。(正常情况下应该是浏览器走 es,server 走 lib)。这个会导致 ssr 时cssinjs 库无法正确收集到样式缓存,进而造成 FOUC 问题(在 antd 社区中也被广泛讨论: ant-design/ant-design#45567
antd 官方给出的解决方案是将 cssinjs 的引入改为 lib,即 从 import { ... } from "@ant-design/cssinjs" 改为 import { ...} from '@ant-design/cssinjs/lib'。而 LobeChat 中引入了 antd-style ,cssinjs 是被藏起来的。所以 @Asuka109 提供了 alias 的解决方案。

    config.resolve.alias['@ant-design/cssinjs'] = '@ant-design/cssinjs/lib';

而 14.0.2 版本的 nextjs 应该解决了上述问题,因此将该补丁移除。

  1. 虽然上面样式 FOUC 的问题通过 alias 解决了,但是 14.0.1 里仍然潜伏了一个很隐蔽的 bug:

我们在做 tts 时, 从 @lobehub/tts/react 引入 antd 组件会触发报错:
76c28361803e8103cf35dbe4c75f74d6

此时如果打印一下这两个组件,会发现引入的不是标准的组件,而是一个 从 lib 转换为 es 模块的 object。
image

升级到 14.0.2 该问题就被解决了……

Copy link

vercel bot commented Nov 16, 2023

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
lobe-chat ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 16, 2023 7:07pm

@lobehubbot
Copy link
Member

👍 @arvinxx

Thank you for raising your pull request and contributing to our Community
Please make sure you have followed our contributing guidelines. We will review it as soon as possible.
If you encounter any problems, please feel free to connect with us.
非常感谢您提出拉取请求并为我们的社区做出贡献,请确保您已经遵循了我们的贡献指南,我们会尽快审查它。
如果您遇到任何问题,请随时与我们联系。

@lobehubbot
Copy link
Member

Bot detected the issue body's language is not English, translate it automatically. 👯👭🏻🧑‍🤝‍🧑👫🧑🏿‍🤝‍🧑🏻👩🏾‍🤝‍👨🏿👬🏿


The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated (UTC)
lobe-chat ✅ Ready (Inspect) Visit Preview Nov 16, 2023 6:54pm

@arvinxx arvinxx merged commit 87a030f into main Nov 16, 2023
6 checks passed
@arvinxx arvinxx deleted the chore/upgrade-nextjs branch November 16, 2023 19:10
@lobehubbot
Copy link
Member

❤️ Great PR @arvinxx ❤️

The growth of project is inseparable from user feedback and contribution, thanks for your contribution!
项目的成长离不开用户反馈和贡献,感谢您的贡献!

@canisminor1990
Copy link
Member

被这个折腾了一天 🤧

@lobehubbot
Copy link
Member

Bot detected the issue body's language is not English, translate it automatically. 👯👭🏻🧑‍🤝‍🧑👫🧑🏿‍🤝‍🧑🏻👩🏾‍🤝‍👨🏿👬🏿


I’ve been struggling with this for a whole day 🤧

@lobehubbot
Copy link
Member

🎉 This PR is included in version 0.101.5 🎉

The release is available on:

Your semantic-release bot 📦🚀

skylinemusiccds pushed a commit to skylinemusiccds/BrainWeaver-development that referenced this pull request May 12, 2024
* 🤖 chore(auto-submit): Add gen-z (lobehub#467)

* 🤖 chore(auto-submit): Generate i18n for gen-z (lobehub#467)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants