尧图网站设计 尧图网站设计YAOTU DESIGN
ARTICLE DETAIL

资讯详情

深耕网站设计与一线实操的经验洞察。

Ontology Playground 环境变量清单:5个VITE_变量如何控制功能开关

Ontology Playground 环境变量清单:5个VITE_变量如何控制功能开关 Ontology Playground 环境变量清单5个VITE_变量如何控制功能开关【免费下载链接】Ontology-PlaygroundFree, open-source web app for learning about ontologies and Microsoft Fabric IQ. Explore a catalogue of pre-built ontologies, design your own visually, export as RDF/XML, and share interactive diagrams. Zero backend, fully static.项目地址: https://gitcode.com/GitHub_Trending/on/Ontology-PlaygroundOntology Playground 是一个免费、开源的本体Ontology学习平台让你浏览预建的本体目录、用可视化设计器创建自己的本体并导出 RDF/XML。为了让项目保持零后端、纯静态架构所有可选功能都由 5 个VITE_环境变量在构建时控制。本文带你完整掌握这份环境变量清单、默认值与配置方法 ️5个VITE_变量速览一张表看懂功能开关官方清单见 README.md所有变量在 src/vite-env.d.ts 中有完整的 TypeScript 类型声明变量默认值控制的功能VITE_ENABLE_AI_BUILDERfalse Azure OpenAI 自然语言本体构建器VITE_ENABLE_LEGACY_FORMATSfalse JSON / YAML / CSV 导入导出格式VITE_BASE_PATH/ 应用部署的基础路径VITE_GITHUB_CLIENT_ID(空) GitHub OAuth 一键提交目录 PRVITE_GITHUB_OAUTH_BASE(空) 生产环境外部 OAuth 代理地址设计思路很清晰默认全部关闭应用开箱即用需要某个扩展能力时把对应开关设为true或填入凭据即可。如何开启AI本体构建器VITE_ENABLE_AI_BUILDER这是功能面最广的开关它同时控制两处前端组件加载src/App.tsx 中用 true做字符串判断只有开关打开时才会懒加载自然语言构建器弹窗NLBuilderModal——注意判断的是字符串true写1或yes都不生效开发服务器代理vite.config.ts 中只有该变量为true时Vite 才会把/api请求代理到本地 Azure Functionslocalhost:7071避免白白占用端口。也就是说改一个变量前端按钮和后端代理一起生效这正是 Vite 构建时内联环境变量带来的好处 ✅如何启用JSON/YAML/CSV导入导出VITE_ENABLE_LEGACY_FORMATS本体项目官方格式是 RDF/XML。如果你希望导入导出弹窗里额外出现 JSON、YAML、CSV 选项设置VITE_ENABLE_LEGACY_FORMATStrue即可。该开关在 src/components/ImportExportModal.tsx 中读取模块加载时就固定下来决定了弹窗里哪些格式按钮可见。VITE_BASE_PATH如何生效让子路径部署自动修正部署到站点子目录例如个人 GitHub Pages 的/仓库名/时静态资源路径必须跟着变。vite.config.ts 的resolveBasePath()按以下优先级取值显式设置了VITE_BASE_PATH→ 直接采用在 GitHub Actions 中构建 → 自动从仓库名推导为/仓库名/其他情况 → 使用根路径/。所以 Fork 后部署到 GitHub Pages 完全不用手动配置构建时自动修正资源 404 问题从根源上避免 GitHub OAuth双变量配合一键提交本体到目录这是唯一需要填值而不是开关的一组变量让设计器里的Submit to Catalogue按钮通过 GitHub Device Flow 自动创建 Fork、分支并提交 PRVITE_GITHUB_CLIENT_ID你的 GitHub OAuth App 客户端 ID。它决定界面上显示Sign in with GitHub还是回退到Download RDF。配置步骤包括启用 Device Flow 与常见报错排查见 docs/github-oauth-setup.mdVITE_GITHUB_OAUTH_BASEOAuth 端点不支持 CORS因此需要代理。src/lib/github.ts 的选择逻辑是——开发环境走 Vite 本地代理/__github生产环境若设置了VITE_GITHUB_OAUTH_BASE例如 Cloudflare Worker 地址则用它否则回退到 Azure 函数路由/api/github-oauth。配置方法改.env文件后记得重启仓库自带的 .env 文件只声明了 3 个最常改的变量其余按需追加VITE_ENABLE_AI_BUILDERfalse VITE_ENABLE_LEGACY_FORMATSfalse VITE_GITHUB_CLIENT_ID配置要点 修改.env后必须重启开发服务器npm run devVite 只在启动时读取环境变量 生产部署同理修改后需重新构建变量会被内联进 JS 产物 只暴露VITE_前缀的变量敏感凭据如 API Key不要加这个前缀。彩蛋页面页脚里的2个隐藏部署变量除了上述 5 个代码里还有两个可选变量src/components/AppFooter.tsx 会读取VITE_DEPLOYED_COMMIT_SHA与VITE_REPOSITORY在页脚显示当前部署的 commit 短哈希。它们由 CI 构建时注入便于访问者核对线上版本对应的源码提交。常见问题开关为什么没生效现象原因与解决AI 构建器按钮不出现确认值为字符串true不是布尔true并重启开发服务器页脚看不到 commit 信息未设置VITE_DEPLOYED_COMMIT_SHA属正常现象OAuth 显示Download RDFVITE_GITHUB_CLIENT_ID为空按 docs/github-oauth-setup.md 配置后重启总结Ontology Playground 用5 个 VITE_ 环境变量实现了一套优雅的功能开关体系VITE_ENABLE_AI_BUILDER与VITE_ENABLE_LEGACY_FORMATS是两个布尔开关VITE_BASE_PATH让子路径部署零配置VITE_GITHUB_CLIENT_IDVITE_GITHUB_OAUTH_BASE则组合出一键提交目录的 OAuth 能力。所有变量默认关闭、按需开启完美契合纯静态、零后端的设计哲学——你只需要一个.env文件就能裁剪出自己的版本 【免费下载链接】Ontology-PlaygroundFree, open-source web app for learning about ontologies and Microsoft Fabric IQ. Explore a catalogue of pre-built ontologies, design your own visually, export as RDF/XML, and share interactive diagrams. Zero backend, fully static.项目地址: https://gitcode.com/GitHub_Trending/on/Ontology-Playground创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表