Skip to content

前端

环境准备

提示:

首先需要在本地安装node,推荐node的版本16+
推荐使用的包管理工具是 yarn
首次使用yarn可以先安装=> npm install yarn -g

通过命令自动初始化项目

在官网下载安装包以后想为前端进行二开, 进入 uniapp/ 或者 pc/ 或者 admin/ 时,可以通过一条命令自动帮你初始化你的项目

下面以uniapp文件夹为例子使用

在终端命令行中输入

npm run init
  1. 运行npm run init 回车 选择是否安装依赖(如果已经安装过可以选择n)

  1. 自动安装成功后会让你输入你的服务器域名地址,例如: https://xxx.com

  1. 选择你需要运行的客户端

  1. 运行成功(则表示当前项目的初始化已经完成,可以开始二开本项目了

警告:

如果通过自动初始化项目的则不需要对下面的教程文档看了,只需看打包生产那部分就好

PC端(pc)(举例,其他两端思路是一样的)


首次使用先安装 yarn install 安装前请确保node版本为推荐的16+

  • 复制env文件
  1. 复制 .env.example ,将复制的文件名修改为 .env

  2. 复制 .env.development.example ,将复制的文件名修改为 .env.developme

  3. 复制 .env.production.example ,将复制的文件名修改为 .env.production

  4. 复制以后示例

  • .env 应用全局配置(通常将他复制出来以后无需修改里面的内容

版本号

NUXT_VERSION=1.0.0

接口默认前缀

NUXT_API_PREFIX=/api

客户端类型

NUXT_CLIENT=4

基础路径

NUXT_BASE_URL=/pc/

是否开启ssr,填些任意值开启

NUXT_SSR=

#端口号

NITRO_PORT=3000

点击打开
* .env.development
  开发环境

请求域名

NUXT_API_URL='输入你的域名'

* .env.production
  生产环境

请求域名

NUXT_API_URL='输入你的请求域名' //填空则跟着网站的域名来请求

以上配置完成后可运行下面命令

PC端开发模式

  • 运行开发环境
yarn dev

PC端生产模式(打包)

打包前修改接口请求域名,打开 .env.production ,修改 NUXT_API_URL 变量的值为项目安装部署的服务端地址

  • 运行生产环境(非seo)

终端中运行命令

yarn build

注意:

如果是非seo模式则不需要修改,将 NUXT_API_URL 留空即可,这样请求接口时会自动读取当前的域名做为接口请求的域名
  • 运行生产环境(seo)

打包支持 seo模式非seo模式(类似于vue的单页面应用),默认为 非seo模式 ,修改 .env 文件可以修改模式

.env 文件中

# 是否开启ssr,填些任意值开启,为空则关闭
NUXT_SSR=1

终端中运行命令

yarn build:ssr

注意:

1. 首先拉取依赖包(拉取之前node版本必须为指定16+版本以上) => yarn install
2. 拉取成功无错误时开始执行打包或者运行模式
3. 如果 运行 或者 拉取 时有错误,请先尝试删除 yarn.lock 文件以及 node_modules 文件夹以后重复1和2步骤