数据可视化前端【免费下载链接】covid19東京都 新型コロナウイルス感染症対策サイト / Tokyo COVID-19 Task Force website项目地址https://gitcode.com/gh_mirrors/co/covid19点击查看免费下载本文面向希望在本地搭建并运行「東京都 新型コロナウイルス感染症対策サイト / Tokyo COVID-19 Task Force website」仓库名covid19的开发者系统讲解基于docs/th/FOR_DEVELOPERS.md泰语版开发者文档的开发全流程从 Node.js、yarn、docker compose、Vagrant 四套环境的选择与安装到本地热重载运行、故障排查、生产/开发环境判别再到分支规范与自动部署机制。读完本文你将能够独立完成该 Nuxt 2 静态站点的开发环境搭建、日常迭代与发布流程操作并能理解其背后的构建与部署实现细节。1. 开发环境搭建开发前需要在环境中安装以下应用。所有命令都在仓库工作副本的根目录下执行。应用名称版本要求仅在指定时需要填写安装条件Node.js18.14.2 或更高必需Visual Studio Code—使用 VS Code 时yarn—使用yarn运行本项目时docker compose—使用docker compose运行本项目时Vagrant—使用Vagrant运行本项目时其中Node.js 18.14.2 及以上是硬性要求这与仓库根目录 package.json 中的声明一致engines: { node: 18.14.2 }同时仓库根目录 Dockerfile 的第一行FROM node:18.14.2-alpine也印证了官方容器镜像正是基于 Node 18.14.2 构建的。也就是说无论你采用哪种本地运行方式yarn / docker compose / Vagrant / Remote Container最终面对的运行时都是同一个 Node.js 版本基线。需要说明的是本泰语版文档仍处于翻译进行中状态正文残留[PLEASE TRANSLATE ME]标记若需对照更完整的英文原文可参阅 docs/en/FOR_DEVELOPERS.md 或 docs/zh_CN/FOR_DEVELOPERS.md。1-1. Visual Studio Code 扩展如果使用 VS Code建议安装以下扩展扩展安装条件ESLint任意情况Vetur任意情况TSLint任意情况Debugger for Chrome任意情况Remote Development使用 VS Code Remote Containers 开发时这些扩展与仓库的实际工程配置是对应的package.json中的lint/lint:fix脚本通过eslint检查全部**/*.{js,ts,vue}文件stylelint检查样式文件并配置了lint-staged在提交前自动执行 ESLint、Stylelint 与 Prettier 修复项目本身是一个 Vue 2 TypeScript 项目vue: 2.7.14、typescript: 5.0.4因此 VeturVue 2 时代的主流 VSCode 插件与 TSLint 均用于提升编辑器内的语法与类型提示体验。2. 使用yarn运行程序以 yarn 方式运行时所有命令在仓库根目录执行。2-1-1. 安装依赖# install dependencies $ yarn install2-1-2. 运行程序执行下述命令后通过访问 http://localhost:3000 即可查看开发中的程序。2-1-2-1. 正常启动# serve with hot reload at localhost:3000 $ yarn dev该命令在 package.json 中的定义为dev: cross-env NODE_ENVdevelopment GENERATE_ENVdevelopment nuxt即通过cross-env注入NODE_ENVdevelopment与GENERATE_ENVdevelopment两个环境变量后以 Nuxt 开发服务器模式启动具备热重载hot reload能力。2-1-2-2. 更快的启动方式禁用无障碍检查如果本地服务器资源占用较高可以禁用无障碍accessibility审计来加速# serve with hot reload at localhost:3000 $ yarn dev-no-axe对应脚本为dev-no-axe: cross-env NODE_ENVdev-no-axe GENERATE_ENVdevelopment nuxt从源码层面看无障碍检查的开关逻辑位于 plugins/axe.tsconst NODE_ENV process.env.NODE_ENV const VUE_AXE process.env.VUE_AXE if (NODE_ENV development VUE_AXE true) { Vue.use(VueAxe, { ... }) }可以看到axe 检查只有在NODE_ENV development且VUE_AXE true时才会被注入该插件已在 nuxt.config.ts 的plugins中注册ssr: true。因此当NODE_ENV被改成dev-no-axe时vue-axe 不再挂载页面渲染与审计开销随之降低。此外该插件还针对节点数过多的环境显式关闭了color-contrast颜色对比度检查并启用了日语文案axe-core/locales/ja.json。2-1-3. 故障排查2-1-3-1. 出现Cannot find module ****错误时重新构建依赖并再次运行程序即可即回到第 2-1-1 节执行$ yarn install然后重新执行yarn dev。这类错误通常由依赖安装不完整或node_modules状态损坏引起仓库还为此提供了清理 webpack 硬缓存hard-source cache的辅助脚本yarn clean-hardsource对应rimraf ./node_modules/.cache/hard-source可在依赖异常时一并尝试。3. 使用docker compose运行程序3-1. 安装依赖并运行# serve with hot reload at localhost:3000 $ docker compose up --build执行后同样通过 http://localhost:3000 访问开发中的程序。该命令会按照 docker-compose.yml 构建并启动服务version: 3 services: app: container_name: covid19 build: . tty: true ports: - 3000:3000 volumes: - .:/app - node_modules:/app/node_modules volumes: node_modules: {}关键点解读build: .使用仓库根目录的 Dockerfile 构建镜像其基于node:18.14.2-alpine先只复制package.json与yarn.lock执行yarn install充分利用镜像层缓存再复制全部源码最终CMD [yarn, dev]启动开发服务器ports: 3000:3000将容器内 3000 端口映射到宿主机配合ENV HOST 0.0.0.0使容器外可以访问通过匿名卷node_modules:/app/node_modules隔离容器内安装的依赖避免宿主机与容器Linux 与 macOS/Windows 文件系统差异之间的node_modules冲突tty: true保证容器内进程能获得 TTY配合 nuxt.config.ts 中watchers.webpack.poll true的轮询监听配置便于在容器卷挂载场景下正确触发热重载。3-2. 故障排查3-2-1. 出现Cannot find module ****错误时先停止程序然后执行$ docker compose run --rm app yarn install该命令会在app服务容器内重新执行yarn install以重建依赖--rm表示运行结束后自动删除临时容器完成后重新docker compose up --build即可。4. 使用Vagrant运行程序4-1. 安装依赖并运行# serve with hot reload at localhost:3000 $ vagrant upVagrantfile 定义了这一方式的技术细节Vagrant.configure(2) do |config| config.vm.box ubuntu/bionic64 config.vm.network forwarded_port, guest: 3000, host: 3000, host_ip: 127.0.0.1 config.vm.provider virtualbox do |vb| vb.memory 2048 end config.vm.provision shell, path: vagrant_provision.sh, privileged: false end虚拟机基于ubuntu/bionic64Ubuntu 18.04将虚拟机内 3000 端口转发到宿主机127.0.0.1:3000分配 2048 MB 内存首次启动时执行 vagrant_provision.sh 完成一次性环境初始化。vagrant_provision.sh 的自动化步骤包括安装g build-essential、通过 nodesource 安装 Node.js、全局安装 yarn、将/vagrant宿主机与虚拟机的共享目录复制为~/covid19并执行yarn install最后生成启动脚本并注册为 systemd 服务covid19.serviceExecStart /bin/bash /home/vagrant/covid19.sh其中以HOST0.0.0.0 /usr/bin/yarn dev启动并配置Restart always与开机自启。5. 使用 Visual Studio Code Remote Containers 开发5-1. 安装依赖并运行参考 VS Code 官方 Quick start: Try a dev container 指南点击 VS Code 左下角选择Open Folder in Container然后选择本仓库根目录即可自动构建开发环境。环境构建完成后访问 http://localhost:3000 查看开发中的程序。仓库根目录的 .devcontainer/devcontainer.json 定义了容器化开发环境{ name: covid19, dockerComposeFile: [../docker-compose.yml], service: app, extensions: [dbaeumer.vscode-eslint], postCreateCommand: yarn install, workspaceFolder: /app, shutdownAction: stopCompose }可以看到Remote Container 方案复用了第 3 节中的docker-compose.yml通过dockerComposeFile指向仓库根目录进入app服务工作目录为/app容器创建后自动执行yarn install关闭 VS Code 窗口时自动停止 compose 服务shutdownAction: stopCompose。5-2. 注意事项如需更改设置请修改.devcontainer/devcontainer.json文件详见官方 devcontainer.json reference启动 Remote Container 时默认只导入了ESLint扩展即extensions: [dbaeumer.vscode-eslint]。如有必要可在.devcontainer/devcontainer.json的extensions数组中按需追加例如第 1-1 节表格中的 Vetur、Debugger for Chrome 等具体方法参考官方 Managing extensions 说明如需重建开发环境点击 VS Code 左下角执行Rebuild Container即可。6. 判断生产环境与其他环境文档明确规定在生产环境中环境变量process.env.GENERATE_ENV的值为production其他情况下为development。运行时请使用该变量来区分当前环境。该约定在仓库中可以被完整验证package.json 中yarn dev与yarn dev-no-axe均注入GENERATE_ENVdevelopment而generate:deploy脚本注入GENERATE_ENVproductiongenerate:deploy: cross-env GENERATE_ENVproduction NODE_OPTIONS--max_old_space_size4096 nuxt generate --fail-on-page-error, generate:dev: cross-env GENERATE_ENVdevelopment NODE_OPTIONS--max_old_space_size4096 nuxt generate --fail-on-page-error实际消费该变量的组件是 components/_shared/DevelopmentModeMark.vue当GENERATE_ENV development时页面底部会渲染一条固定的黄色横幅「開発中development mode」并提供跳转至正式公开网站的链接production环境下则不渲染。这是文档所述判断逻辑在 UI 层面的直接实现。因此开发者可以放心依赖该变量编写仅开发环境生效的逻辑例如打印调试信息、注入 mock 数据等无需再自行拼接其他环境判断。7. 部署到生产环境的流程当下表左列分支被更新时对应分支的 HTML 构建与站点会自动更新分支branch构建并更新 HTML 的分支被更新的网站masterproduction生产站点 https://stopcovid19.metro.tokyo.lg.jp/staginggh-pages预演staging站点 https://stopcovid19-tokyo-staging.web.app/developmentdev-pages开发站点 https://stopcovid19-tokyo-development.web.app/也就是说日常协作中开发者只需要向development推送代码CI/CD 会自动把构建产物发布到dev-pages分支对应的 Firebase Hosting 站点待内容稳定后由管理员合并到staging、再合入master分别触发预演站点与生产站点的更新。这一流程与仓库内的静态生成配置一致nuxt.config.ts 设置了target: static并通过generate.routes()依据 assets/json/cardRoutesSettings.json 中的卡片路由生成en / zh-cn / zh-tw / ko / ja-basic等多语言静态页面而 firebase.json 中定义了development / staging / production三个 hosting target均以dist为发布目录并统一配置了/g-mark到云函数gMark的 rewrite 与指向东京都福祉保健局官方新冠信息门户的 301 跳转。8. 分支branch使用规则Pull Request 只接受推送到development分支。推送 PR 时请按以下规则命名自己的分支变更类型分支命名规则新增功能featurefeature/#{ISSUE_ID}-#{branch_title_name}Hotfix 提交hotfix/#{ISSUE_ID}-#{branch_title_name}其中#{ISSUE_ID}为关联 Issue 的编号#{branch_title_name}为该分支的简短标题名。8-1. 主分支main branches用途分支URL可发起 PR 的人备注开发developmenthttps://stopcovid19-tokyo-development.web.app/所有开发者主分支用于接收 Pull Request预演Stagingstaginghttps://stopcovid19-tokyo-staging.web.app/仅管理员用于发布到生产前的最终确认除管理员本人外禁止创建 PR生产Productionmasterhttps://stopcovid19.metro.tokyo.lg.jp/仅管理员禁止管理员以外的人创建 PR补充部分语言版本的开发者文档还列有dev-hotfix分支用于应对正式版的紧急修复仅在管理员要求时使用可参阅 docs/zh_CN/FOR_DEVELOPERS.md 中的对应表格。8-2. 系统使用的分支branches used by the system用途分支URL备注生产站点 HTMLproductionhttps://stopcovid19.metro.tokyo.lg.jp/存放生产环境静态 HTML预演站点 HTMLgh-pageshttps://stopcovid19-tokyo-staging.web.app/存放预演环境静态 HTMLOGP 工作目录deploy/new_ogp无用于 OGP社交分享卡片更新这些由系统自动维护的分支属于构建产物分支与第 8-1 节的人工协作分支严格分离开发者不应直接向production/gh-pages/dev-pages手工提交而应通过更新master/staging/development触发自动构建。仓库中与 OGP 更新相关的辅助工具可见于 ogp_invalidator/含twitter_card_invalidator.py及配套 Dockerfile用于在内容更新后主动失效并刷新 Twitter 卡片缓存。结语至此围绕 docs/th/FOR_DEVELOPERS.md 的完整开发流程已经梳理清楚环境方面支持 yarn / docker compose / Vagrant / VS Code Remote Containers 四种方式殊途同归地指向 Node 18.14.2 Nuxt 2 Vue 2 的技术栈运行与排障上yarn dev/docker compose up --build/vagrant up均可获得 localhost:3000 的热重载开发体验而dev-no-axe与GENERATE_ENV则分别解决了性能与运行环境判别的实际问题协作与发布上feature/#{ISSUE_ID}-#{branch_title_name}/hotfix/#{ISSUE_ID}-#{branch_title_name}的命名规范与development → staging → master的三级分支策略配合 CI 自动构建构成了一个对大量外部贡献者开放、又对正式发布严格把关的完整工作流。若需继续深入了解可阅读英文版 docs/en/FOR_DEVELOPERS.md文档的原始基准版本、仓库根目录的 FOR_DEVELOPERS.md 与 FOR_DEVELOPERS_RSPEC.mdRSpec 测试运行说明以及 CONTRIBUTING.md贡献规范。赞分享数据可视化前端【免费下载链接】covid19東京都 新型コロナウイルス感染症対策サイト / Tokyo COVID-19 Task Force website项目地址https://gitcode.com/gh_mirrors/co/covid19点击查看免费下载相关推荐PySlowFast与Azure Video Analyzer对比功能与性能分析PySlowFast与Azure Video Analyzer对比功能与性能分析 你还在为视频分析项目选择工具而烦恼吗面对开源框架与云服务的两难抉择如何平数据可视化前端Modernizr 特性检测编写完全指南从 Metadata 规范到测试验证的完整实战Modernizr 特性检测编写完全指南从 Metadata 规范到测试验证的完整实战 导读 Modernizr 是一款在浏览器端检测 HTML5 / CSS数据可视化前端Supabase开发环境搭建与本地部署指南Supabase开发环境搭建与本地部署指南 你还在为后端开发配置繁琐的数据库、认证和API服务而烦恼吗本文将带你一步到位搭建Supabase本地开发环境无需后端前端数据库上一篇3大调试神技终结Capacitor跨平台开发痛点从日志到性能全解析下一篇解密智能自动化配置如何让黑苹果EFI生成变得简单高效创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 东京都 COVID-19 对策网站（covid19）开发者指南：环境搭建、本地运行与部署发布实战
数据可视化前端【免费下载链接】covid19東京都 新型コロナウイルス感染症対策サイト / Tokyo COVID-19 Task Force website项目地址https://gitcode.com/gh_mirrors/co/covid19点击查看免费下载本文面向希望在本地搭建并运行「東京都 新型コロナウイルス感染症対策サイト / Tokyo COVID-19 Task Force website」仓库名covid19的开发者系统讲解基于docs/th/FOR_DEVELOPERS.md泰语版开发者文档的开发全流程从 Node.js、yarn、docker compose、Vagrant 四套环境的选择与安装到本地热重载运行、故障排查、生产/开发环境判别再到分支规范与自动部署机制。读完本文你将能够独立完成该 Nuxt 2 静态站点的开发环境搭建、日常迭代与发布流程操作并能理解其背后的构建与部署实现细节。1. 开发环境搭建开发前需要在环境中安装以下应用。所有命令都在仓库工作副本的根目录下执行。应用名称版本要求仅在指定时需要填写安装条件Node.js18.14.2 或更高必需Visual Studio Code—使用 VS Code 时yarn—使用yarn运行本项目时docker compose—使用docker compose运行本项目时Vagrant—使用Vagrant运行本项目时其中Node.js 18.14.2 及以上是硬性要求这与仓库根目录 package.json 中的声明一致engines: { node: 18.14.2 }同时仓库根目录 Dockerfile 的第一行FROM node:18.14.2-alpine也印证了官方容器镜像正是基于 Node 18.14.2 构建的。也就是说无论你采用哪种本地运行方式yarn / docker compose / Vagrant / Remote Container最终面对的运行时都是同一个 Node.js 版本基线。需要说明的是本泰语版文档仍处于翻译进行中状态正文残留[PLEASE TRANSLATE ME]标记若需对照更完整的英文原文可参阅 docs/en/FOR_DEVELOPERS.md 或 docs/zh_CN/FOR_DEVELOPERS.md。1-1. Visual Studio Code 扩展如果使用 VS Code建议安装以下扩展扩展安装条件ESLint任意情况Vetur任意情况TSLint任意情况Debugger for Chrome任意情况Remote Development使用 VS Code Remote Containers 开发时这些扩展与仓库的实际工程配置是对应的package.json中的lint/lint:fix脚本通过eslint检查全部**/*.{js,ts,vue}文件stylelint检查样式文件并配置了lint-staged在提交前自动执行 ESLint、Stylelint 与 Prettier 修复项目本身是一个 Vue 2 TypeScript 项目vue: 2.7.14、typescript: 5.0.4因此 VeturVue 2 时代的主流 VSCode 插件与 TSLint 均用于提升编辑器内的语法与类型提示体验。2. 使用yarn运行程序以 yarn 方式运行时所有命令在仓库根目录执行。2-1-1. 安装依赖# install dependencies $ yarn install2-1-2. 运行程序执行下述命令后通过访问 http://localhost:3000 即可查看开发中的程序。2-1-2-1. 正常启动# serve with hot reload at localhost:3000 $ yarn dev该命令在 package.json 中的定义为dev: cross-env NODE_ENVdevelopment GENERATE_ENVdevelopment nuxt即通过cross-env注入NODE_ENVdevelopment与GENERATE_ENVdevelopment两个环境变量后以 Nuxt 开发服务器模式启动具备热重载hot reload能力。2-1-2-2. 更快的启动方式禁用无障碍检查如果本地服务器资源占用较高可以禁用无障碍accessibility审计来加速# serve with hot reload at localhost:3000 $ yarn dev-no-axe对应脚本为dev-no-axe: cross-env NODE_ENVdev-no-axe GENERATE_ENVdevelopment nuxt从源码层面看无障碍检查的开关逻辑位于 plugins/axe.tsconst NODE_ENV process.env.NODE_ENV const VUE_AXE process.env.VUE_AXE if (NODE_ENV development VUE_AXE true) { Vue.use(VueAxe, { ... }) }可以看到axe 检查只有在NODE_ENV development且VUE_AXE true时才会被注入该插件已在 nuxt.config.ts 的plugins中注册ssr: true。因此当NODE_ENV被改成dev-no-axe时vue-axe 不再挂载页面渲染与审计开销随之降低。此外该插件还针对节点数过多的环境显式关闭了color-contrast颜色对比度检查并启用了日语文案axe-core/locales/ja.json。2-1-3. 故障排查2-1-3-1. 出现Cannot find module ****错误时重新构建依赖并再次运行程序即可即回到第 2-1-1 节执行$ yarn install然后重新执行yarn dev。这类错误通常由依赖安装不完整或node_modules状态损坏引起仓库还为此提供了清理 webpack 硬缓存hard-source cache的辅助脚本yarn clean-hardsource对应rimraf ./node_modules/.cache/hard-source可在依赖异常时一并尝试。3. 使用docker compose运行程序3-1. 安装依赖并运行# serve with hot reload at localhost:3000 $ docker compose up --build执行后同样通过 http://localhost:3000 访问开发中的程序。该命令会按照 docker-compose.yml 构建并启动服务version: 3 services: app: container_name: covid19 build: . tty: true ports: - 3000:3000 volumes: - .:/app - node_modules:/app/node_modules volumes: node_modules: {}关键点解读build: .使用仓库根目录的 Dockerfile 构建镜像其基于node:18.14.2-alpine先只复制package.json与yarn.lock执行yarn install充分利用镜像层缓存再复制全部源码最终CMD [yarn, dev]启动开发服务器ports: 3000:3000将容器内 3000 端口映射到宿主机配合ENV HOST 0.0.0.0使容器外可以访问通过匿名卷node_modules:/app/node_modules隔离容器内安装的依赖避免宿主机与容器Linux 与 macOS/Windows 文件系统差异之间的node_modules冲突tty: true保证容器内进程能获得 TTY配合 nuxt.config.ts 中watchers.webpack.poll true的轮询监听配置便于在容器卷挂载场景下正确触发热重载。3-2. 故障排查3-2-1. 出现Cannot find module ****错误时先停止程序然后执行$ docker compose run --rm app yarn install该命令会在app服务容器内重新执行yarn install以重建依赖--rm表示运行结束后自动删除临时容器完成后重新docker compose up --build即可。4. 使用Vagrant运行程序4-1. 安装依赖并运行# serve with hot reload at localhost:3000 $ vagrant upVagrantfile 定义了这一方式的技术细节Vagrant.configure(2) do |config| config.vm.box ubuntu/bionic64 config.vm.network forwarded_port, guest: 3000, host: 3000, host_ip: 127.0.0.1 config.vm.provider virtualbox do |vb| vb.memory 2048 end config.vm.provision shell, path: vagrant_provision.sh, privileged: false end虚拟机基于ubuntu/bionic64Ubuntu 18.04将虚拟机内 3000 端口转发到宿主机127.0.0.1:3000分配 2048 MB 内存首次启动时执行 vagrant_provision.sh 完成一次性环境初始化。vagrant_provision.sh 的自动化步骤包括安装g build-essential、通过 nodesource 安装 Node.js、全局安装 yarn、将/vagrant宿主机与虚拟机的共享目录复制为~/covid19并执行yarn install最后生成启动脚本并注册为 systemd 服务covid19.serviceExecStart /bin/bash /home/vagrant/covid19.sh其中以HOST0.0.0.0 /usr/bin/yarn dev启动并配置Restart always与开机自启。5. 使用 Visual Studio Code Remote Containers 开发5-1. 安装依赖并运行参考 VS Code 官方 Quick start: Try a dev container 指南点击 VS Code 左下角选择Open Folder in Container然后选择本仓库根目录即可自动构建开发环境。环境构建完成后访问 http://localhost:3000 查看开发中的程序。仓库根目录的 .devcontainer/devcontainer.json 定义了容器化开发环境{ name: covid19, dockerComposeFile: [../docker-compose.yml], service: app, extensions: [dbaeumer.vscode-eslint], postCreateCommand: yarn install, workspaceFolder: /app, shutdownAction: stopCompose }可以看到Remote Container 方案复用了第 3 节中的docker-compose.yml通过dockerComposeFile指向仓库根目录进入app服务工作目录为/app容器创建后自动执行yarn install关闭 VS Code 窗口时自动停止 compose 服务shutdownAction: stopCompose。5-2. 注意事项如需更改设置请修改.devcontainer/devcontainer.json文件详见官方 devcontainer.json reference启动 Remote Container 时默认只导入了ESLint扩展即extensions: [dbaeumer.vscode-eslint]。如有必要可在.devcontainer/devcontainer.json的extensions数组中按需追加例如第 1-1 节表格中的 Vetur、Debugger for Chrome 等具体方法参考官方 Managing extensions 说明如需重建开发环境点击 VS Code 左下角执行Rebuild Container即可。6. 判断生产环境与其他环境文档明确规定在生产环境中环境变量process.env.GENERATE_ENV的值为production其他情况下为development。运行时请使用该变量来区分当前环境。该约定在仓库中可以被完整验证package.json 中yarn dev与yarn dev-no-axe均注入GENERATE_ENVdevelopment而generate:deploy脚本注入GENERATE_ENVproductiongenerate:deploy: cross-env GENERATE_ENVproduction NODE_OPTIONS--max_old_space_size4096 nuxt generate --fail-on-page-error, generate:dev: cross-env GENERATE_ENVdevelopment NODE_OPTIONS--max_old_space_size4096 nuxt generate --fail-on-page-error实际消费该变量的组件是 components/_shared/DevelopmentModeMark.vue当GENERATE_ENV development时页面底部会渲染一条固定的黄色横幅「開発中development mode」并提供跳转至正式公开网站的链接production环境下则不渲染。这是文档所述判断逻辑在 UI 层面的直接实现。因此开发者可以放心依赖该变量编写仅开发环境生效的逻辑例如打印调试信息、注入 mock 数据等无需再自行拼接其他环境判断。7. 部署到生产环境的流程当下表左列分支被更新时对应分支的 HTML 构建与站点会自动更新分支branch构建并更新 HTML 的分支被更新的网站masterproduction生产站点 https://stopcovid19.metro.tokyo.lg.jp/staginggh-pages预演staging站点 https://stopcovid19-tokyo-staging.web.app/developmentdev-pages开发站点 https://stopcovid19-tokyo-development.web.app/也就是说日常协作中开发者只需要向development推送代码CI/CD 会自动把构建产物发布到dev-pages分支对应的 Firebase Hosting 站点待内容稳定后由管理员合并到staging、再合入master分别触发预演站点与生产站点的更新。这一流程与仓库内的静态生成配置一致nuxt.config.ts 设置了target: static并通过generate.routes()依据 assets/json/cardRoutesSettings.json 中的卡片路由生成en / zh-cn / zh-tw / ko / ja-basic等多语言静态页面而 firebase.json 中定义了development / staging / production三个 hosting target均以dist为发布目录并统一配置了/g-mark到云函数gMark的 rewrite 与指向东京都福祉保健局官方新冠信息门户的 301 跳转。8. 分支branch使用规则Pull Request 只接受推送到development分支。推送 PR 时请按以下规则命名自己的分支变更类型分支命名规则新增功能featurefeature/#{ISSUE_ID}-#{branch_title_name}Hotfix 提交hotfix/#{ISSUE_ID}-#{branch_title_name}其中#{ISSUE_ID}为关联 Issue 的编号#{branch_title_name}为该分支的简短标题名。8-1. 主分支main branches用途分支URL可发起 PR 的人备注开发developmenthttps://stopcovid19-tokyo-development.web.app/所有开发者主分支用于接收 Pull Request预演Stagingstaginghttps://stopcovid19-tokyo-staging.web.app/仅管理员用于发布到生产前的最终确认除管理员本人外禁止创建 PR生产Productionmasterhttps://stopcovid19.metro.tokyo.lg.jp/仅管理员禁止管理员以外的人创建 PR补充部分语言版本的开发者文档还列有dev-hotfix分支用于应对正式版的紧急修复仅在管理员要求时使用可参阅 docs/zh_CN/FOR_DEVELOPERS.md 中的对应表格。8-2. 系统使用的分支branches used by the system用途分支URL备注生产站点 HTMLproductionhttps://stopcovid19.metro.tokyo.lg.jp/存放生产环境静态 HTML预演站点 HTMLgh-pageshttps://stopcovid19-tokyo-staging.web.app/存放预演环境静态 HTMLOGP 工作目录deploy/new_ogp无用于 OGP社交分享卡片更新这些由系统自动维护的分支属于构建产物分支与第 8-1 节的人工协作分支严格分离开发者不应直接向production/gh-pages/dev-pages手工提交而应通过更新master/staging/development触发自动构建。仓库中与 OGP 更新相关的辅助工具可见于 ogp_invalidator/含twitter_card_invalidator.py及配套 Dockerfile用于在内容更新后主动失效并刷新 Twitter 卡片缓存。结语至此围绕 docs/th/FOR_DEVELOPERS.md 的完整开发流程已经梳理清楚环境方面支持 yarn / docker compose / Vagrant / VS Code Remote Containers 四种方式殊途同归地指向 Node 18.14.2 Nuxt 2 Vue 2 的技术栈运行与排障上yarn dev/docker compose up --build/vagrant up均可获得 localhost:3000 的热重载开发体验而dev-no-axe与GENERATE_ENV则分别解决了性能与运行环境判别的实际问题协作与发布上feature/#{ISSUE_ID}-#{branch_title_name}/hotfix/#{ISSUE_ID}-#{branch_title_name}的命名规范与development → staging → master的三级分支策略配合 CI 自动构建构成了一个对大量外部贡献者开放、又对正式发布严格把关的完整工作流。若需继续深入了解可阅读英文版 docs/en/FOR_DEVELOPERS.md文档的原始基准版本、仓库根目录的 FOR_DEVELOPERS.md 与 FOR_DEVELOPERS_RSPEC.mdRSpec 测试运行说明以及 CONTRIBUTING.md贡献规范。赞分享数据可视化前端【免费下载链接】covid19東京都 新型コロナウイルス感染症対策サイト / Tokyo COVID-19 Task Force website项目地址https://gitcode.com/gh_mirrors/co/covid19点击查看免费下载相关推荐PySlowFast与Azure Video Analyzer对比功能与性能分析PySlowFast与Azure Video Analyzer对比功能与性能分析 你还在为视频分析项目选择工具而烦恼吗面对开源框架与云服务的两难抉择如何平数据可视化前端Modernizr 特性检测编写完全指南从 Metadata 规范到测试验证的完整实战Modernizr 特性检测编写完全指南从 Metadata 规范到测试验证的完整实战 导读 Modernizr 是一款在浏览器端检测 HTML5 / CSS数据可视化前端Supabase开发环境搭建与本地部署指南Supabase开发环境搭建与本地部署指南 你还在为后端开发配置繁琐的数据库、认证和API服务而烦恼吗本文将带你一步到位搭建Supabase本地开发环境无需后端前端数据库上一篇3大调试神技终结Capacitor跨平台开发痛点从日志到性能全解析下一篇解密智能自动化配置如何让黑苹果EFI生成变得简单高效创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考