大家好啊,我是测评君,欢迎来到web测评,上一期给大家分享niucloud-admin的uniapp多端框架在本地运行与宝塔的部署方式,这一期继续给大家分享,niucloud的web前端nuxt3是怎么在本地运行,并且怎么打包发布上宝塔。
视频教程
技术架构
nuxt3 + nuxt-windicss + vite + typescript + nodejs + vscode
cnetos7以上 + 宝塔面板
文字搭建教程
下载vscode,安装nodejs环境(不懂安装可以去看我以前的环境搭建教程),然后用vscode打开web目录,修改env目录下的接口配置文件(参照视频教程来修改)。然后安装node依赖,执行 npm install
如果要进行本地开发,可以执行 npm run dev
本地开发好以后,执行 npm run generate 打包,打包好以后会在网站目录生成dist文件夹。
需要修改下dist目录编译包中index.html文件,因为编译出的文件是属于单站,所以需要修改路径,可以匹配saas多站。两处代码需要替换:第一处搜索
第二处搜索baseURL,将整体这一句替换为如下:
替换后保存,将dist下的所有文件压缩,运行环境(宝塔)中的niucloud/public/web 中所有文件全部清除掉。
将生成的编译压缩包上传到运行环境中,解压,以上操作完成,浏览器就可以访问web端。
系统介绍
niucloud-admin前端以及后端采用严格的多语言开发规范,包括前端展示,api接口返回,数据验证,错误返回等全部使用多语言设计规范,使开发者能够真生意义上实现多语言的开发需求。
niucloud-admin结合系统结构特点专门开发了代码生成器,这样开发者根据数据表就可以一键生成基础的业务代码,包括:后台php业务代码以及对应的前端vue代码。
前端采用标准的element-plus,开发者不需要详细了解前端,只需要用标准的element组件就可以。
系统实测截图
网站中的所有源码资源,均不是该源码资源的价格,本身开源源码是不用付费的。这是赞助录制搭建视频教程、收集整理资源、服务器维护的基础开销费用!
不想付费的朋友可以自行去GitHub或者Gitee搜索相关开源项目,了解其开源协议。再根据视频视频教程来搭建即可。
领取专属 10元无门槛券
私享最新 技术干货