環(huán)境搭建教程:端口、環(huán)境變量與 Prerequisites 完整清單)
Pascal Editor 開發(fā)環(huán)境搭建教程端口、環(huán)境變量與 Prerequisites 完整清單【免費(fèi)下載鏈接】editorCreate and share 3D architectural projects.項(xiàng)目地址: https://gitcode.com/GitHub_Trending/editor93/editorPascal Editor 是一款基于 React Three Fiber 和 WebGPU 的開源 3D 建筑編輯器。本文是一份面向新手的環(huán)境搭建指南完整覆蓋 Prerequisites 前置條件、開發(fā)端口3002/3000、環(huán)境變量配置與 Docker 啟動方式幫助你在 10 分鐘內(nèi)跑起自己的 3D 建筑編輯環(huán)境。? 一、Prerequisites搭建前必備條件清單Pascal Editor 是一個 Turborepo 單體倉庫monorepo使用Bun作為包管理器。在動手之前請對照下面這張清單檢查你的環(huán)境前置條件版本要求說明Bun1.3包管理器與運(yùn)行時根目錄package.json中鎖定為bun1.3.14Node.js20.9engines字段聲明的最低版本Git任意穩(wěn)定版用于拉取倉庫Docker可選任意穩(wěn)定版僅在使用容器方式啟動時需要 官方文檔在倉庫根目錄的SETUP.md中Prerequisites 一節(jié)只列了 Bun 1.3 和 Node.js 20.9 兩項(xiàng)其余依賴都會由bun install自動處理。 二、一鍵安裝從克隆到啟動只需 3 步步驟 1克隆倉庫git clone https://gitcode.com/GitHub_Trending/editor93/editor cd editor步驟 2安裝依賴bun install步驟 3啟動開發(fā)服務(wù)器bun dev啟動后瀏覽器訪問http://localhost:3002即可看到編輯器。bun dev實(shí)際執(zhí)行的是根package.json中的腳本先通過dotenv加載.env和.env.defaults再由 Turborepo 啟動所有包的構(gòu)建監(jiān)聽和 Next.js 開發(fā)服務(wù)器——所以請務(wù)必在倉庫根目錄執(zhí)行這樣才能獲得packages/core、packages/viewer等包的熱更新。? 三、端口說明3002 和 3000 各代表什么新手最容易困惑的就是端口問題這里一次性講清楚3002—— 本地開發(fā)默認(rèn)端口。由倉庫根目錄的.env.defaults文件統(tǒng)一寫入PORT3002該文件會被bun dev自動加載優(yōu)先級低于 shell 環(huán)境變量和.env.local。3000—— Docker 容器端口。docker-compose.yml中固定映射3000:3000且不建議修改/scenes頁面通過NEXT_PUBLIC_APP_URL拉取自身 API該值在 Next.js 構(gòu)建時內(nèi)聯(lián)端口映射不一致會導(dǎo)致頁面返回 500。動態(tài)端口—— 使用官方 CLI 啟動時會自主選擇無沖突的回環(huán)端口見下文。另外倉庫自帶.devcontainer/devcontainer.jsonVS Code Dev Containers 用戶打開倉庫后會自動基于 Bun 鏡像啟動容器并轉(zhuǎn)發(fā) 3002 端口省去了手動安裝運(yùn)行時。?? 四、環(huán)境變量完整清單多數(shù)可跳過本地開發(fā)和官方托管版本無需任何環(huán)境變量即可運(yùn)行。如果你需要自定義可執(zhí)行cp .env.example .env以下是完整的環(huán)境變量參考清單變量名是否必填默認(rèn)值作用PORT否3002開發(fā)服務(wù)器端口定義在.env.defaultsMINT_PASCAL_HOST_ORIGIN否—自托管部署時的公共編輯器地址用于登錄與同源校驗(yàn)NEXT_PUBLIC_APP_URL否—應(yīng)用基地址Docker 場景下決定/scenes的 API 基址PASCAL_DATA_DIR否—Docker 中場景數(shù)據(jù)庫SQLite存放目錄compose 文件里指向/dataNEXT_PUBLIC_ASSETS_CDN_URL否—素材 CDN 地址可選客戶端側(cè)變量PASCAL_PORTABLE_BUILD否—置為1時生成standalone便攜構(gòu)建Google Maps API Key否—啟用地址搜索功能缺失不影響其他功能客戶端側(cè)變量的校驗(yàn)邏輯見apps/editor/env.mjs基于 Zod 的createEnv.env.example中對每個變量都附有用途注釋建議先讀注釋再填寫。 五、Docker 方式不裝 Bun 也能跑如果不想在本地安裝 Node/Bun一條命令即可docker compose up -d啟動后訪問http://localhost:3000。關(guān)鍵細(xì)節(jié)保存的場景存放在pascal-data數(shù)據(jù)卷中docker compose down也不會丟失數(shù)據(jù)若在其他域名托管可覆蓋來源變量MINT_PASCAL_HOST_ORIGINhttps://pascal.example.com docker compose up -d鏡像基于oven/bun:1.3.14-alpine見Dockerfile并額外安裝了 Node.js因?yàn)?Next 16 的構(gòu)建在純 Bun 鏡像中會崩潰——這也是版本對齊--frozen-lockfile的常見坑點(diǎn)。 六、常用腳本速查表命令作用bun dev啟動開發(fā)服務(wù)器http://localhost:3002bun build構(gòu)建所有包bun checkBiome 檢查 lint 與格式bun check:fix自動修復(fù) lint 與格式問題bun check-typesTypeScript 類型檢查bun run test通過 Turborepo 運(yùn)行全部包測試bun kill一鍵結(jié)束占用 3002 端口的進(jìn)程bun restart結(jié)束進(jìn)程 清理緩存 重新bun dev?? 注意跑測試請用bun run test而不是裸bun test——后者會繞過 Turborepo 直接掃描dist/下的編譯產(chǎn)物導(dǎo)致統(tǒng)計虛高。? 七、常見問題端口被占用了怎么辦這是新手最高頻的報錯場景。3002 端口被占用時執(zhí)行bun kill它等價于lsof -ti:3002 | xargs kill -9定義在根package.json。如果依賴狀態(tài)異常例如切換分支后報錯用bun restart一次性完成殺進(jìn)程、清理.next/.turbo緩存并重啟。 搭建完成你將獲得什么開發(fā)環(huán)境跑通后你打開的就是一個功能完整的 3D 建筑編輯器墻體、樓板、門窗、屋面等建筑元素以節(jié)點(diǎn)樹Site → Building → Level → Wall/Slab/Roof組織內(nèi)置數(shù)百種家具與建筑構(gòu)件空調(diào)、窗戶、燈具等 3D 模型和 PBR 材質(zhì)紋理均位于apps/editor/public/下并支持撤銷重做、空間網(wǎng)格碰撞校驗(yàn)與 WebGPU 渲染。 小結(jié)目標(biāo)一句話方案本地開發(fā)裝好 Bun 1.3 與 Node 20.9然后bun installbun dev訪問 3002 端口自定義配置復(fù)制.env.example為.env按需填PORT、MINT_PASCAL_HOST_ORIGIN免安裝運(yùn)行docker compose up -d訪問 3000 端口掌握以上端口、環(huán)境變量與前置條件三張清單你就完成了 Pascal Editor 開發(fā)環(huán)境的全部搭建可以開始你的 3D 建筑項(xiàng)目之旅了。【免費(fèi)下載鏈接】editorCreate and share 3D architectural projects.項(xiàng)目地址: https://gitcode.com/GitHub_Trending/editor93/editor創(chuàng)作聲明:本文部分內(nèi)容由AI輔助生成(AIGC),僅供參考