Skip to content

开发

从v2.0版本开始,我们采用了Functions Advanced Mode + Wrangler Pages Dev的开发模式

这意味着您可以非常轻松的在本地开发属于您自己的图床服务

准备工作

首先你需要克隆这个仓库

bash
git clone https://github.com/Stoeaves/Cf-Github-ImgBed.git

然后进入项目根目录

bash
cd Cf-Github-ImgBed

安装依赖

bash
npm install

开始

在根目录下你可以创建一个wrangler.toml文件,用于储存您的本地开发变量

不用担心泄密,这个文件会被.gitignore忽略,所以不会上传到Github

以下是wrangler.toml文件的示例内容:

toml
[[kv_namespaces]]
binding = "KV"
id = "xxxxxxxxx"

[vars]
ADMIN_PASSWORD = "xxx"
GITHUB_TOKEN = "ghp_xxxxxxxxxxxxxxxxxxxx"
RSA_PRIVATE_KEY = "xxx"
RSA_PUBLIC_KEY = ""

您仅需复制此示例内容,然后填入相应的值即可

然后我们就可以开始开发了,运行:

bash
npm run dev

然后你大概会收到以下提示:

bash
> cloudflare-github-imgbed@2.0.0 dev
> npm-run-all -p dev:*


> cloudflare-github-imgbed@2.0.0 dev:build
> vite build --watch


> cloudflare-github-imgbed@2.0.0 dev:pages
> wrangler pages dev dist

vite v7.3.3 building client environment for production...

watching for file changes...

build started...
transforming (38) node_modules\@vue\reactivity\dist\reactivity.esm-bundler.js

 ⛅️ wrangler 4.93.1
───────────────────

 Compiled Worker successfully
 38 modules transformed.
dist/index.html                   0.90 kB gzip:  0.53 kB
dist/assets/index-Ch5P55Iw.css   49.97 kB gzip:  7.60 kB
dist/assets/index-DT0cRIPn.js   183.12 kB gzip: 61.82 kB
built in 1000ms.
Your Worker has access to the following bindings:
Binding                                                                   Resource                  Mode
env.KV (xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx)                                 KV Namespace              local
env.CF_PAGES ("1")                                                        Environment Variable      local
env.CF_PAGES_BRANCH ("main")                                              Environment Variable      local
env.CF_PAGES_COMMIT_SHA ("xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx...")      Environment Variable      local
env.CF_PAGES_URL ("https://xxxxxxx.Cloudflare-Github-Img...")             Environment Variable      local
env.ADMIN_PASSWORD ("xxxxxx")                                             Environment Variable      local
env.GITHUB_TOKEN ("ghp_xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx...")             Environment Variable      local
env.RSA_PRIVATE_KEY ("XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX...")          Environment Variable      local
env.RSA_PUBLIC_KEY ("XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX...")           Environment Variable      local

╭───────────────────────────────────────────────────────────────────────────────────────────────────────────────╮
  [b] open a browser [d] open devtools [e] open local explorer [t] start tunnel [c] clear console [x] to exit  │
╰───────────────────────────────────────────────────────────────────────────────────────────────────────────────╯
 Starting local server...
[wrangler:info] Ready on http://127.0.0.1:8788

此时你就可以在浏览器打开http://127.0.0.1:8788,进行本地调试

并且当你修改了代码后,会自动重新编译,您仅需重新刷新浏览器页面即可

如果您想修改本地调试地址的端口,可以在wrangler.toml里加入以下内容:

toml
[dev]
port = 8788

部署

当您开发完成后,您可以通过以下命令进行部署:

bash
npm run build
npm run deploy

注意事项

  • 本地开发时,您需要确保您的wrangler.toml文件中的ADMIN_PASSWORDGITHUB_TOKENRSA_PRIVATE_KEYRSA_PUBLIC_KEY的值是正确的,以及KVid是正确的