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

下面以uniapp文件夹为例子使用
在终端命令行中输入

npm run init

运行npm run init 回车选择是否安装依赖（如果已经安装过可以选择n）

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

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

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

⚠️ 警告

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

PC端(pc)

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

复制env文件

复制.env.example，将复制的文件名修改为.env

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

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

复制以后示例

.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

注意

首先拉取依赖包（拉取之前node版本必须为指定16+版本以上） =>yarn install

拉取成功无错误时开始执行打包或者运行模式

如果运行或者拉取时有错误，请先尝试删除yarn.lock文件以及node_modules文件夹以后重复1和2步骤

移动端（uniapp）

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

复制env文件

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

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

复制以后示例

点击打开

.env.development 开发环境

NODE_ENV = 'development'

# 请求域名
VITE_APP_BASE_URL='输入你的请求域名'

.env.production 生产环境

NODE_ENV = 'production'

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

uniapp在VSCode开发

开发模式

运行h5
终端中运行命令

yarn dev:h5

运行小程序
终端中运行命令

yarn dev:mp-weixin

运行完毕，打开微信开发者工具，点击左上角菜单项目>导入项目，导入地址选择uniapp/dist/dev/mp-weixin，点击确定成功导入项目

生产模式

发行h5

终端中运行命令

yarn build:h5

上传打包好的代码到服务器或仓库

运行小程序
终端中运行命令

yarn build:mp-weixin

运行完毕，打开微信开发者工具，点击左上角菜单项目>导入项目，导入地址选择uniapp/dist/dev/mp-weixin，点击确定成功导入项目

uniapp在HbuilderX开发

插件推荐安装：在运行过程中会自动安装需要插件

运行uniapp

注意

apple M系列芯片在uniapp下编译的报错处理：在node_modules下复制粘贴esbuild-darwin-arm64一份，重命名为esbuild-darwin-64

导入项目，点击HbuilderX左上角菜单文件>导入>从本地目录导入，目录选择uniapp

安装依赖，选中当前项目，点击HbuilderX左上角菜单工具>外部命令>npm install安装依赖

运行到h5，点击HbuilderX左上角菜单运行>运行到浏览器>Chrome

运行到微信小程序，点击HbuilderX左上角菜单运行>运行到小程序模拟器>微信开发者工具 - (uniapp)

注意

运行到微信小程序前，先配置好小程序的appid，点击uniapp/src/manifest.json，选择微信小程序配置>微信小程序AppID，输入appid即可

一般运行到微信小程序，会自动打开微信开发者工具，如果打开失败，可能是工具的服务端口没有打开，手动打开工具 -> 设置 -> 安全设置，将服务端口开启，也有可能是你配置的小程序appid中，你登录的账号不是这个小程序的开发者，只需要去微信小程序后台将该账号添加到开发者，重新运行即可

发行uniapp

发行到h5

点击HbuilderX左上角菜单发行>网站-PC Web或手机H5(仅适用于uni-app)，输入网站标题，点击发行按钮，编译完成后可在uniapp/dist/build/h5下

将h5下面的代码复制到发布目录，然后上传代码到服务器或仓库即可

发行到小程序

点击HbuilderX左上角菜单发行>小程序-微信(仅适用于uni-app)，输入小程序名称和小程序appid，点击发行，编译完成后会自动打开微信开发者工具

点击微信开发者工具的上传按钮，将代码上传到微信小程序后台

后台管理（admin）

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

复制env文件

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

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

复制以后示例

点击打开

.env.development 开发环境

NODE_ENV = 'development'

# 请求域名
VITE_APP_BASE_URL='输入你的请求域名'

.env.production 生产环境

NODE_ENV = 'production'

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

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

后台管理开发模式（运行 admin

运行开发环境
终端中运行命令

yarn dev

后台管理生产模式（打包 admin

运行生产环境
终端中运行命令

yarn build

注意

首先拉取依赖包（拉取之前node版本必须为指定16+版本以上） =>yarn install

拉取成功无错误时开始执行打包或者运行模式（yarn build / yarn dev）

如果运行或者拉取时有错误，请先尝试删除yarn.lock文件以及node_modules文件夹以后重复1和2步骤

环境准备

PC端(pc)

版本号

接口默认前缀

客户端类型

基础路径

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

端口号

请求域名

请求域名

PC端生产模式（打包）

移动端（uniapp）

uniapp在VSCode开发

开发模式

生产模式

uniapp在HbuilderX开发

运行uniapp

发行uniapp

后台管理（admin）

后台管理开发模式（运行 admin

后台管理生产模式（打包 admin

持续更新

环境准备

PC端(pc)#

版本号#

接口默认前缀#

客户端类型#

基础路径#

是否开启ssr，填些任意值开启#

端口号#

请求域名#

请求域名#

PC端生产模式（打包）#

移动端（uniapp）#

uniapp在VSCode开发#

开发模式#

生产模式#

uniapp在HbuilderX开发#

运行uniapp#

发行uniapp#

后台管理（admin）#

后台管理开发模式（运行 admin#

后台管理生产模式（打包 admin#

持续更新#

PC端(pc)

版本号

接口默认前缀

客户端类型

基础路径

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

端口号

请求域名

请求域名

PC端生产模式（打包）

移动端（uniapp）

uniapp在VSCode开发

开发模式

生产模式

uniapp在HbuilderX开发

运行uniapp

发行uniapp

后台管理（admin）

后台管理开发模式（运行 admin

后台管理生产模式（打包 admin

持续更新