Skip to main content

一键启动oneThread前端项目

作者：程序员马丁

在线博客：https://nageoffer.com

note

热门项目实战社群，收获国内众多知名公司面试青睐，近千名同学面试成功！助力你在校招或社招上拿个offer。

一键启动oneThread前端项目，元数据信息：

©版权所有 - 拿个offer-开源&项目实战星球专属学习项目，依据《中华人民共和国著作权法实施条例》和《知识星球产权保护》，严禁未经本项目原作者明确书面授权擅自分享至 GitHub、Gitee 等任何开放平台。违者将面临法律追究。

内容摘要：本章节指导大家 Windows 电脑如何通过 Nginx 快速启动前端项目，以及 Windows 和 Mac 电脑如何通过源码安装方式启动。

课程目录如下所示：

  • 快速启动
  • 安装 Nodejs
  • 启动前端项目

在启动前端项目之前，请先确保后端服务已运行。如果后端尚未启动，请先完成后端项目的启动流程。

快速启动​

如果你是 Windows 电脑，可以通过 Nginx 快速启动的方式部署短链接前端工程。下载这个短链接压缩包，并解压。

通过网盘分享的文件：nageoffer-nginx-1.3.0.1.zip
链接: https://pan.baidu.com/s/1hEbVSRKE_FsOT_PyI1eLgQ?pwd=**** 提取码: ****

然后双击 nginx 图标执行启动逻辑。

浏览器访问 localhost 如果返回 nginx 页面，则证明 nginx 启动成功。

浏览器访问 http://localhost:5176/ 跳转 oneThread 登录页面，既为前端启动成功，可以正常使用系统。

如果想自己本地安装 nodejs 的方式请参考下文。

安装 Nodejs​

oneThread 项目前端安装 20.15.0 版本 Nodejs，其它版本存在版本不兼容等问题。

1. 电脑中没安装过 Nodejs​

打开下述链接 🔗 访问 Nodejs 下载页面：https://nodejs.org/download/release/v20.15.0

根据不同的操作系统下载安装不同的包。下载完成后，双击打开对应的安装软件包，应该就可以通过鼠标点点点的方式进行安装。

  • Windows 电脑：node-v20.15.0-win-x86.zip
  • Mac 电脑：node-v20.15.0.pkg

安装完成后，终端输入 node -v 检查是否安装成功，输入命令返回以下信息表示安装成功。

2. 电脑中已有 Nodejs​

如果电脑中已经存在 Nodejs 环境，检查版本是否在 20.15.0 版本，如果不是需要安装 Nodejs 多版本控制组件，下载多个 Nodejs 共存，并通过命令切换。或者简单点，直接删除之前版本，下载 20.15.0 版本即可。

2.1 Mac 电脑教程​

# 安装 n 组件
npm install -g n

# 安装完成后，查看 n -V
n -V

注意，-V 是大写的，出现以下信息代表安装成功。

下载多版本 Nodejs 组件。

# 安装 20.15.0 版本的 Nodejs
n 20.15.0

# 安装完成后，执行切换
sudo n 20.15.0

# 切换成功后，输入 node -v 查看版本是否正确
node -v

2.2 Windows 电脑教程​

点击查看 Windows 电脑切换 Nodejs 多版本参考链接。

启动前端项目​

下载 onethread-dashboard 前端项目，依次执行下述命令。

1. 通过 npm 安装依赖​

进入 onethread-dashboard 项目的根目录。

# 使用项目指定的pnpm版本进行依赖安装
npm i -g corepack

# 安装依赖
pnpm install

2. 启动项目​

# 启动项目
pnpm dev

3. 访问前端页面​

通过访问 前端界面 进行登录体验功能。

完结，撒花 🎉

Table of Contents