php寶塔部署niucloud-admin開源SaaS系統背景架構電腦pc端vue源碼

大家好啊，我是測評君，歡迎來到web測評，上一期給大家分享niucloud-admin的uniapp多端架構在本地運作與寶塔的部署方式，這一期繼續給大家分享，niucloud的web前端nuxt3是怎麼在本地運作，并且怎麼打包釋出上寶塔。

技術架構

• nuxt3 + nuxt-windicss + vite + typescript + nodejs + vscode
• cnetos7以上 + 寶塔面闆

文字搭建教程

1. 下載下傳vscode，安裝nodejs環境（不懂安裝可以去看我以前的環境搭建教程），然後用vscode打開web目錄，修改env目錄下的接口配置檔案（參照視訊教程來修改）。然後安裝node依賴，執行 npm install
2. 如果要進行本地開發，可以執行 npm run dev
3. 本地開發好以後，執行 npm run generate 打包，打包好以後會在網站目錄生成dist檔案夾。
4. 需要修改下dist目錄編譯包中index.html檔案，因為編譯出的檔案是屬于單站，是以需要修改路徑，可以比對saas多站。兩處代碼需要替換：第一處搜尋<script 标簽，在第一個标簽前加第一句代碼；如下：

const match = location.href.match(/\/web\/(\d*)\//);           

1. 第二處搜尋baseURL，将整體這一句替換為如下：

baseURL:match ? `/web/${match[1]}/` : '/web/',           

1. 替換後儲存，将dist下的所有檔案壓縮，運作環境（寶塔）中的niucloud/public/web 中所有檔案全部清除掉。
2. 将生成的編譯壓縮包上傳到運作環境中，解壓，以上操作完成，浏覽器就可以通路web端。

系統介紹

niucloud-admin前端以及後端采用嚴格的多語言開發規範，包括前端展示，api接口傳回，資料驗證，錯誤傳回等全部使用多語言設計規範，使開發者能夠真生意義上實作多語言的開發需求。

niucloud-admin結合系統結構特點專門開發了代碼生成器，這樣開發者根據資料表就可以一鍵生成基礎的業務代碼，包括：背景php業務代碼以及對應的前端vue代碼。

前端采用标準的element-plus，開發者不需要詳細了解前端，隻需要用标準的element元件就可以。

系統實測截圖

視訊教程

php寶塔搭建部署niucloudadmin開源SaaS系統架構電腦pc端vue源碼

關于資源下載下傳

1. 網站中的所有源碼資源，均不是該源碼資源的價格，本身開源源碼是不用付費的。這是贊助錄制搭建視訊教程、收集整理資源、伺服器維護的基礎開銷費用！
2. 不想付費的朋友可以自行去GitHub或者Gitee搜尋相關開源項目，了解其開源協定。再根據視訊視訊教程來搭建即可。

免責聲明

1. 本站上傳的源碼，均為平台購買，作者提供，網友推薦，網際網路平台整理而來。
2. 上述源碼的知識産權及相關權利歸作者及制作公司所有。
3. 上述源碼僅供學習參考及技術交流之用，未經源碼的知識産權權利人同意，使用者不得進行商業使用。
4. 上述源碼如需商業使用，請自行聯系源碼知識産權權利人進行授權，否則，我們将積極配合作品知識産權權利人 一起維權。
5. 上述源碼如有侵犯您的知識産權，請您立刻聯系我們，我們會在24小時内做删除下架處理。