立即开发

✅ 请确保你的本地 Node 环境 ＞= 18.0.0 版本

获取 NuxtBase 源代码

进入到我的页面，下载你购买的源代码压缩包。解压后，你会看到以下目录结构，分别分为前端目录和后端目录

├── browser
│   ├── README.md
│   ├── app.vue
│   ├── assets
│   ├── components
│   ├── composables
│   ├── content
│   ├── node_modules
│   ├── nuxt.config.ts
│   ├── package.json
│   ├── pages
│   ├── plugins
│   ├── public
│   ├── store
│   ├── tailwind.config.js
│   ├── tsconfig.json
│   └── utils
└── server
    ├── README.md
    ├── bootstrap.js
    ├── build.sh
    ├── dist
    ├── jest.config.js
    ├── logs
    ├── node_modules
    ├── package.json
    ├── src
    └── tsconfig.json

运行前端

1. 填入对应的环境变量

请确保你已在browser目录下的.env.文件，填入了对应的环境变量

# 你的 Supabase URL
SUPABASE_URL=你的supabase_url
# 你的 Supabase Key
SUPABASE_KEY=你的_supabase_key
# 你的服务端请求地址
HTTP_BASE_URL=http://localhost:7010

2. 安装依赖

在/browser/目录下执行命令

npm install

3. 运行前端

在/browser/目录下执行命令

npm run dev

运行后端

1. 填入对应的环境变量

请确保你在在server目录下的.env.文件，填入对应的环境变量

```plaintext
# AI 服务商环境变量
OPENAI_API_KEY=你的_openai_api_key
OPENAI_BASE_URL=你的_openai_base_url

# Supabase 环境变量
SUPABASE_URL=你的_supabase_url
SUPABASE_PRIVATE_KEY=你的_supabase_private_key

# ZPay 支付环境变量
ZPAY_PAY_KEY=你的_zpay_pay_key
ZPAY_PAY_PID=你的_zpay_pay_pid
ZPAY_NOTIFY_URL=你的_zpay_notify_url

2. 安装依赖

在/server/目录下执行命令

npm install

3.运行后端

在/server/目录下执行命令

npm run dev

4.在Memfire创建表

进入到你的Memfire应用控制台，我们需要创建3张表来满足我们的基本业务需要。当然这3张表的业务只是最基础的模板中的业务需要，你也可以新增字段并根据你的业务增加对应的逻辑:

• nuxtbase_bought_history：用户购买历史
• nuxtbase_user_subscription：用户订阅历史
• nuxtbase_user_token：用户的token

点击左侧【SQL执行器】，点击创建表：

分别执行以下SQL就能完成这3张表的创建：

(1)nuxtbase_bought_history

create table
  public.nuxtbase_bought_history (
    id bigint generated by default as identity,
    time timestamp with time zone not null,
    pid text null,
    pname text null,
    uid text null,
    out_trade_no text null,
    meta json null,
    constraint bought_history_pkey primary key (id)
  ) tablespace pg_default;

(2)nuxtbase_user_subscription

create table
  public.nuxtbase_user_subscription (
    id bigint generated by default as identity,
    uid text null,
    expire_time timestamp with time zone null,
    constraint nuxtbase_user_subscription_pkey primary key (id),
    constraint nuxtbase_user_subscription_uid_key unique (uid)
  ) tablespace pg_default;

(3)nuxtbase_user_token

create table
  public.nuxtbase_user_token (
    id bigint generated by default as identity,
    uid text not null,
    token bigint null,
    constraint nuxtbase_user_token_pkey primary key (id, uid),
    constraint nuxtbase_user_token_uid_key unique (uid)
  ) tablespace pg_default;

运行成功 🎉

一切顺利的话，此时你应该就从成功的运行起了 NuxtBase 的前后端，你可以访问http://localhost:3000开始你的AI开发之旅了！