⭐️ 继续准备 NextJS 新官网项目（二）

• NextJS 如何在自动化部署 CI 根据不同环境使用多个配置文件

  • 参考了一位 大神 的做法，就是 cp 一下变成 .env.local 就好
  • 只要 CI 过程中判断好环境变量就好了
  • 我司用的是 CircleCI，根据这个 文档 修改配置大致如下

workflows:
  dev_build_and_deploy:
    jobs:
      - build-and-push:
        ext-build-args: --build-arg BUILD_ENV=dev

...

jobs:
  build-and-push:
    parameters:
      ext-build-args:
        type: string
    steps:
      - aws-ecr/build-and-push-image:
        extra-build-args: <<parameters.ext-build-args>>

• 其实现在的部署流程还是存在问题的，因为构建不在 CI 步骤，而是在 Dockerfile 里

  • 官方也有提供 Docker 的 一套方案
  • 简单看了下，就是生成一个带依赖文件的最小可执行代码，从而不需要 pnpm install 了
  • 前提是设置 next.config.js 文件的一个 output 属性，参考
  • 之后部署文件均存放在 .next/standalone 目录下，还需要额外复制出其他静态内容
  • 目前考虑到站点的尽快上线，就没和运维继续协作修改配置了

• NextJS 设置多语言中间件之后，next.config.ts 里面的 Rewrites 规则不生效了

  • 因为去掉这个中间件，则一切正常，参考 官方文档 说明，这个配置文件的优先级是最高的
  • 我的理解是，一旦配置文件的 Rewrites 规则能匹配上，则不再处理中间件里面的重写规则了
  • 难道说它实际 Rewrite 了两次？但如果换成 Redirect 的话，这里就是死循环也不会匹配成功
  • 最后参考多语言背后的代码实现，简单整了一个 Demo，并且发了一条 Issues
  • 随机应变改用 Caddy 来做反向代理，我编写了一篇 博客文章 讲述配置过程
  • 24.06.28 补充：其实是优先级错了，详见 继续准备 NextJS 新官网项目（三）

• 了解到一款“自动剪辑神器”的项目，发现他是用前端技术做的

  • 视频格式转换用了 FFmpeg 的 WASM 版本，实在是妙