chore: 重构项目结构
This commit is contained in:
anghunk
@@ -3,12 +3,12 @@
|
||||
>
|
||||
> 目前处于内测阶段，欢迎参与测试。
|
||||
|
||||
<img src="https://github.com/anghunk/cwd-comments/blob/main/icon.png?raw=true" width="72" />
|
||||
<img src="https://github.com/anghunk/cwd/blob/main/icon.png?raw=true" width="72" />
|
||||
|
||||
# CWD (Cloudflare Workers Discuss)
|
||||
|
||||
基于 Cloudflare Workers 与全球边缘网络的免服务器、极速安全、即插即用评论系统。
|
||||
|
||||
[文档地址](https://cwd-comments-docs.zishu.me)
|
||||
[文档地址](https://cwd-docs.zishu.me)
|
||||
|
||||
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="shortcut icon" href="https://github.com/anghunk/cwd-comments/blob/main/icon.png?raw=true"
|
||||
<link rel="shortcut icon" href="https://github.com/anghunk/cwd/blob/main/icon.png?raw=true"
|
||||
type="image/x-icon">
|
||||
<title>CWD 评论系统后台</title>
|
||||
</head>
|
||||
@@ -1,5 +1,5 @@
|
||||
{
|
||||
"name": "cwd-comments-admin",
|
||||
"name": "cwd-admin",
|
||||
"version": "0.0.1",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
File diff suppressed because one or more lines are too long
@@ -1,7 +1,12 @@
|
||||
<template>
|
||||
<div class="layout">
|
||||
<header class="layout-header">
|
||||
<button class="layout-menu-toggle" @click="toggleSider" aria-label="切换菜单" type="button">
|
||||
<button
|
||||
class="layout-menu-toggle"
|
||||
@click="toggleSider"
|
||||
aria-label="切换菜单"
|
||||
type="button"
|
||||
>
|
||||
<svg class="layout-menu-icon" viewBox="0 0 24 24" width="18" height="18">
|
||||
<path
|
||||
d="M4 7h16a1 1 0 0 0 0-2H4a1 1 0 0 0 0 2zm0 6h16a1 1 0 0 0 0-2H4a1 1 0 0 0 0 2zm0 6h16a1 1 0 0 0 0-2H4a1 1 0 0 0 0 2z"
|
||||
@@ -12,18 +17,10 @@
|
||||
<div class="layout-title">CWD 评论后台</div>
|
||||
<div class="layout-actions-wrapper">
|
||||
<div class="layout-actions">
|
||||
<a
|
||||
class="layout-button"
|
||||
href="https://cwd-comments-docs.zishu.me"
|
||||
target="_blank"
|
||||
>
|
||||
<a class="layout-button" href="https://cwd-docs.zishu.me" target="_blank">
|
||||
使用文档
|
||||
</a>
|
||||
<a
|
||||
class="layout-button"
|
||||
href="https://github.com/anghunk/cwd-comments"
|
||||
target="_blank"
|
||||
>
|
||||
<a class="layout-button" href="https://github.com/anghunk/cwd" target="_blank">
|
||||
Github
|
||||
</a>
|
||||
<button class="layout-button" @click="handleLogout">退出</button>
|
||||
@@ -48,14 +45,21 @@
|
||||
<button class="layout-actions-item" type="button" @click="openGithub">
|
||||
Github
|
||||
</button>
|
||||
<button class="layout-actions-item layout-actions-item-danger" type="button" @click="handleLogoutFromActions">
|
||||
<button
|
||||
class="layout-actions-item layout-actions-item-danger"
|
||||
type="button"
|
||||
@click="handleLogoutFromActions"
|
||||
>
|
||||
退出
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="layout-body">
|
||||
<nav class="layout-sider" :class="{ 'layout-sider-mobile-open': isMobileSiderOpen }">
|
||||
<nav
|
||||
class="layout-sider"
|
||||
:class="{ 'layout-sider-mobile-open': isMobileSiderOpen }"
|
||||
>
|
||||
<ul class="menu">
|
||||
<li
|
||||
class="menu-item"
|
||||
@@ -80,11 +84,7 @@
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div
|
||||
v-if="isMobileSiderOpen"
|
||||
class="layout-sider-mask"
|
||||
@click="closeSider"
|
||||
/>
|
||||
<div v-if="isMobileSiderOpen" class="layout-sider-mask" @click="closeSider" />
|
||||
<main class="layout-content">
|
||||
<router-view />
|
||||
</main>
|
||||
@@ -139,12 +139,12 @@ function goSettings() {
|
||||
}
|
||||
|
||||
function openDocs() {
|
||||
window.open("https://cwd-comments-docs.zishu.me", "_blank");
|
||||
window.open("https://cwd-docs.zishu.me", "_blank");
|
||||
closeActions();
|
||||
}
|
||||
|
||||
function openGithub() {
|
||||
window.open("https://github.com/anghunk/cwd-comments", "_blank");
|
||||
window.open("https://github.com/anghunk/cwd", "_blank");
|
||||
closeActions();
|
||||
}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
{
|
||||
"name": "cwd-comments-api",
|
||||
"name": "cwd-api",
|
||||
"version": "0.0.1",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
@@ -205,7 +205,7 @@ app.use('/admin/*', async (c, next) => {
|
||||
|
||||
app.get('/', (c) => {
|
||||
return c.html(
|
||||
`CWD 评论部署成功，当前版本 ${VERSION}，<a href="https://github.com/anghunk/cwd-comments" target="_blank" rel="noreferrer">查看文档</a>`
|
||||
`CWD 评论部署成功，当前版本 ${VERSION}，<a href="https://github.com/anghunk/cwd" target="_blank" rel="noreferrer">查看文档</a>`
|
||||
);
|
||||
});
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
*/
|
||||
{
|
||||
"$schema": "node_modules/wrangler/config-schema.json",
|
||||
"name": "cwd-comments-api",
|
||||
"name": "cwd-api",
|
||||
"main": "src/index.ts",
|
||||
"compatibility_date": "2026-01-03",
|
||||
"compatibility_flags": [
|
||||
@@ -10,14 +10,14 @@ const commentsRoot = ref(null);
|
||||
onMounted(async () => {
|
||||
if (!commentsRoot.value || typeof window === "undefined") return;
|
||||
|
||||
const apiBaseUrl = "https://cwd-comments-api.anghunk.workers.dev";
|
||||
const apiBaseUrl = "https://cwd-api.anghunk.workers.dev";
|
||||
|
||||
if (!apiBaseUrl) return;
|
||||
|
||||
if (!window.CWDComments) {
|
||||
await new Promise((resolve, reject) => {
|
||||
const script = document.createElement("script");
|
||||
script.src = "https://cwd-comments.zishu.me/cwd-comments.js";
|
||||
script.src = "https://cwd.zishu.me/cwd.js";
|
||||
script.async = true;
|
||||
script.onload = () => resolve();
|
||||
script.onerror = (e) => reject(e);
|
||||
|
||||
@@ -11,7 +11,7 @@ export default defineConfig({
|
||||
'link',
|
||||
{
|
||||
rel: 'icon',
|
||||
href: 'https://github.com/anghunk/cwd-comments/blob/main/icon.png?raw=true',
|
||||
href: 'https://github.com/anghunk/cwd/blob/main/icon.png?raw=true',
|
||||
},
|
||||
],
|
||||
],
|
||||
@@ -23,10 +23,10 @@ export default defineConfig({
|
||||
label: 'On this page',
|
||||
},
|
||||
editLink: {
|
||||
pattern: 'https://github.com/anghunk/cwd-comments/blob/main/docs/:path',
|
||||
pattern: 'https://github.com/anghunk/cwd/blob/main/docs/:path',
|
||||
text: '在 GitHub 上编辑此页面',
|
||||
},
|
||||
socialLinks: [{ icon: 'github', link: 'https://github.com/anghunk/cwd-comments' }],
|
||||
socialLinks: [{ icon: 'github', link: 'https://github.com/anghunk/cwd' }],
|
||||
|
||||
lastUpdated: true,
|
||||
lastUpdatedText: '最后更新于',
|
||||
|
||||
@@ -20,14 +20,14 @@
|
||||
|
||||
## 使用官方管理后台
|
||||
|
||||
使用官方提供的管理后台（最新版本）https://cwd-comments.zishu.me。
|
||||
使用官方提供的管理后台（最新版本）https://cwd.zishu.me
|
||||
|
||||
登陆时填入你的 api 地址、账号和密码。
|
||||
|
||||
## 自部署
|
||||
|
||||
```bash
|
||||
cd cwd-comments-admin
|
||||
cd cwd-admin
|
||||
|
||||
# 安装依赖
|
||||
npm install
|
||||
@@ -42,11 +42,11 @@ npm run build
|
||||
npm run preview
|
||||
```
|
||||
|
||||
将 `cwd-comments-admin/dist` 目录部署到任意静态站点托管服务（如 Cloudflare Pages、Vercel、Netlify 等），并确保浏览器可以访问到后端 API 地址。
|
||||
将 `/cwd-admin/dist` 目录部署到任意静态站点托管服务（如 Cloudflare Pages、Vercel、Netlify 等），并确保浏览器可以访问到后端 API 地址。
|
||||
|
||||
- 管理后台（admin）：基于 Vite + Vue 3 的单页应用，用于管理评论和系统配置。
|
||||
|
||||
- `cwd-comments-admin/`：管理后台源码
|
||||
- `/cwd-admin`：管理后台源码
|
||||
- 运行环境：浏览器
|
||||
- 构建工具：Vite + Vue 3
|
||||
|
||||
@@ -55,7 +55,7 @@ npm run preview
|
||||
评论组件本身不依赖打包时的环境变量，只需要在运行时传入 `apiBaseUrl` 即可。
|
||||
管理后台使用 Vite 环境变量进行多环境配置，推荐按以下方式区分开发 / 测试 / 生产环境：
|
||||
|
||||
在 `cwd-comments-admin` 目录下创建对应的环境文件：
|
||||
在 `/cwd-admin` 目录下创建对应的环境文件：
|
||||
|
||||
```bash
|
||||
# 开发环境
|
||||
@@ -66,7 +66,7 @@ cp .env.example .env
|
||||
|
||||
| 变量名 | 说明 | 示例 |
|
||||
| --------------------- | ----------------------------------------------- | ----------------------------------- |
|
||||
| `VITE_API_BASE_URL` | 后端 API 地址（Cloudflare Worker 域名或自定义） | `https://cwd-comments-api.test.com` |
|
||||
| `VITE_API_BASE_URL` | 后端 API 地址（Cloudflare Worker 域名或自定义） | `https://cwd-api.test.com` |
|
||||
| `VITE_ADMIN_NAME` | 登录页默认管理员账号占位值 | `admin@example.com` |
|
||||
| `VITE_ADMIN_PASSWORD` | 登录页默认密码占位值 | `123456` |
|
||||
|
||||
|
||||
@@ -6,14 +6,14 @@
|
||||
* 拥有一个 Node.js 运行环境，版本 >= 22（本地部署需要）
|
||||
* 拥有一个域名并托管在 Cloudflare 上（这个不是必须项，但可以提高国内访问速度，也更方便）
|
||||
|
||||
后端项目目录为 `/cwd-comments-api`，基于 Cloudflare Workers + D1 + KV 实现。
|
||||
后端项目目录为 `/cwd-api`，基于 Cloudflare Workers + D1 + KV 实现。
|
||||
|
||||
## 自部署
|
||||
|
||||
**以下部署指令均在该目录下执行，不在根目录下**
|
||||
|
||||
```
|
||||
cd cwd-comments-api
|
||||
cd cwd-api
|
||||
```
|
||||
|
||||
### 本地部署
|
||||
@@ -81,7 +81,7 @@ npm install
|
||||
npm run deploy
|
||||
```
|
||||
|
||||
没有异常报错后，可以进入 Cloudflare Workers 面板查看是否部署成功，若显示存在一个名称为 `cwd-comments-api` 的项目即推送成功。
|
||||
没有异常报错后，可以进入 Cloudflare Workers 面板查看是否部署成功，若显示存在一个名称为 `cwd-api` 的项目即推送成功。
|
||||
|
||||
#### 3. 配置环境变量
|
||||
|
||||
@@ -91,7 +91,7 @@ npm install
|
||||
|
||||
#### 4. 检测部署情况
|
||||
|
||||
部署成功后回得到一个域名，即为后端的域名（格式一般为`https://cwd-comments-api.xxx.workers.dev`。访问该域名，如果显示部署成功页面，说明 API 部署成功，可以到管理后台进行登录，当然也可以使用自定义域名。
|
||||
部署成功后回得到一个域名，即为后端的域名（格式一般为`https://cwd-api.xxx.workers.dev`。访问该域名，如果显示部署成功页面，说明 API 部署成功，可以到管理后台进行登录，当然也可以使用自定义域名。
|
||||
|
||||
可以直接访问域名，确认是否部署成功。如果成功，则会显示
|
||||
|
||||
@@ -101,7 +101,7 @@ CWD 评论部署成功，当前版本...
|
||||
|
||||
## 环境变量与绑定
|
||||
|
||||
后端通过 Cloudflare Worker 的绑定和环境变量控制行为，类型定义见 [`cwd-comments-api/src/bindings.ts`](../../cwd-comments-api/src/bindings.ts)。
|
||||
后端通过 Cloudflare Worker 的绑定和环境变量控制行为，类型定义见 `cwd-api/src/bindings.ts`.
|
||||
|
||||
所需环境变量如下表所示。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
|
||||
```html
|
||||
<div id="comments"></div>
|
||||
<script src="https://cwd-comments.zishu.me/cwd-comments.js"></script>
|
||||
<script src="https://cwd.zishu.me/cwd.js"></script>
|
||||
<script>
|
||||
const comments = new CWDComments({
|
||||
el: '#comments',
|
||||
@@ -58,7 +58,7 @@ comments.updateConfig({ theme: 'dark' });
|
||||
|
||||
```html
|
||||
<div id="comments"></div>
|
||||
<script src="https://cwd-comments.zishu.me/cwd-comments.js"></script>
|
||||
<script src="https://cwd.zishu.me/cwd.js"></script>
|
||||
<script>
|
||||
const comments = new CWDComments({
|
||||
el: '#comments',
|
||||
@@ -72,7 +72,7 @@ comments.updateConfig({ theme: 'dark' });
|
||||
|
||||
```astro
|
||||
<div id="comments"></div>
|
||||
<script src="https://cwd-comments.zishu.me/cwd-comments.js" is:inline></script>
|
||||
<script src="https://cwd.zishu.me/cwd.js" is:inline></script>
|
||||
<script is:inline>
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
const comments = new window.CWDComments({
|
||||
|
||||
@@ -9,7 +9,7 @@ CWD 评论系统。
|
||||
|
||||
是基于 Cloudflare Workers 与全球边缘网络的免服务器、极速安全、即插即用评论系统。
|
||||
|
||||
[文档地址](https://cwd-comments-docs.zishu.me)
|
||||
[文档地址](https://cwd-docs.zishu.me)
|
||||
|
||||
|
||||
|
||||
@@ -30,19 +30,19 @@ CWD 评论系统。
|
||||
|
||||
```bash
|
||||
# 克隆项目
|
||||
git clone https://github.com/anghunk/cwd-comments
|
||||
git clone https://github.com/anghunk/cwd
|
||||
|
||||
# API 项目
|
||||
cd cwd-comments-api
|
||||
cd cwd-api
|
||||
# 部署请查看文档
|
||||
|
||||
# 前端项目
|
||||
cd cwd-comments-web
|
||||
cd cwd-admin
|
||||
npm install
|
||||
|
||||
```
|
||||
|
||||
## 配置
|
||||
|
||||
- [后端配置](https://cwd-comments-docs.zishu.me/guide/backend-config.html)
|
||||
- [前端配置](https://cwd-comments-docs.zishu.me/guide/frontend-config.html)
|
||||
- [后端配置](https://cwd-docs.zishu.me/guide/backend-config.html)
|
||||
- [前端配置](https://cwd-docs.zishu.me/guide/frontend-config.html)
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
## 接口更新
|
||||
|
||||
```
|
||||
cd cwd-comments-api
|
||||
cd cwd-api
|
||||
npm install
|
||||
npm run deploy
|
||||
```
|
||||
@@ -15,7 +15,7 @@ npm run deploy
|
||||
## 后台更新
|
||||
|
||||
```
|
||||
cd cwd-comments-admin
|
||||
cd cwd-admin
|
||||
npm install
|
||||
npm run build
|
||||
```
|
||||
@@ -24,8 +24,8 @@ npm run build
|
||||
|
||||
## 评论端更新
|
||||
|
||||
使用最新的 `cwd-comments.js` ，你可以托管到任何地方，不受限制。
|
||||
使用最新的 `cwd.js` ，你可以托管到任何地方，不受限制。
|
||||
|
||||
如果你不想自己托管，请使用官方的链接: `https://cwd-comments.zishu.me/cwd-comments.js`
|
||||
如果你不想自己托管，请使用官方的链接：`https://cwd.zishu.me/cwd.js`
|
||||
|
||||
不需要手动更新，每次评论端加载时会自动检查更新。
|
||||
|
||||
@@ -5,7 +5,7 @@ hero:
|
||||
name: CWD 评论系统
|
||||
tagline: 基于 Cloudflare Workers 与全球边缘网络的免服务器、极速安全、即插即用评论系统。
|
||||
image:
|
||||
src: https://github.com/anghunk/cwd-comments/blob/main/icon.png?raw=true
|
||||
src: https://github.com/anghunk/cwd/blob/main/icon.png?raw=true
|
||||
alt: 文档封面
|
||||
actions:
|
||||
- theme: brand
|
||||
|
||||
@@ -2,4 +2,4 @@
|
||||
|
||||
## 使用方法
|
||||
|
||||
文档：https://cwd-comments-docs.zishu.me/guide/frontend-config.html
|
||||
文档：https://cwd-docs.zishu.me/guide/frontend-config.html
|
||||
|
||||
@@ -57,7 +57,7 @@ export class CWDComments {
|
||||
if (typeof el === 'string') {
|
||||
const element = document.querySelector(el);
|
||||
if (!element) {
|
||||
throw new Error(`元素未找到: ${el}`);
|
||||
throw new Error(`元素未找到：${el}`);
|
||||
}
|
||||
if (!(element instanceof HTMLElement)) {
|
||||
throw new Error(`目标不是 HTMLElement: ${el}`);
|
||||
@@ -281,7 +281,7 @@ export class CWDComments {
|
||||
}
|
||||
|
||||
// 创建头部统计
|
||||
let header = this.mountPoint.querySelector('.cwd-comments-header');
|
||||
let header = this.mountPoint.querySelector('.cwd-header');
|
||||
if (!header) {
|
||||
header = document.createElement('div');
|
||||
header.className = 'cwd-comments-header';
|
||||
@@ -292,7 +292,7 @@ export class CWDComments {
|
||||
`;
|
||||
this.mountPoint.appendChild(header);
|
||||
}
|
||||
const countEl = header.querySelector('.cwd-comments-count-number');
|
||||
const countEl = header.querySelector('.cwd-count-number');
|
||||
if (countEl) {
|
||||
countEl.textContent = state.pagination.totalCount;
|
||||
}
|
||||
@@ -400,8 +400,8 @@ export class CWDComments {
|
||||
}
|
||||
|
||||
// 更新头部统计
|
||||
const header = this.mountPoint?.querySelector('.cwd-comments-header');
|
||||
const countEl = header?.querySelector('.cwd-comments-count-number');
|
||||
const header = this.mountPoint?.querySelector('.cwd-header');
|
||||
const countEl = header?.querySelector('.cwd-count-number');
|
||||
if (countEl) {
|
||||
countEl.textContent = state.pagination.totalCount;
|
||||
}
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
* 使用方法：
|
||||
* ```html
|
||||
* <div id="comments"></div>
|
||||
* <script src="cwd-comments.js"></script>
|
||||
* <script src="cwd.js"></script>
|
||||
* <script>
|
||||
* new CWDComments({
|
||||
* el: '#comments',
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
}
|
||||
|
||||
/* ========== 容器 ========== */
|
||||
.cwd-comments-container {
|
||||
.cwd-container {
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans', Helvetica, Arial, sans-serif,
|
||||
'Apple Color Emoji', 'Segoe UI Emoji';
|
||||
font-size: 14px;
|
||||
@@ -24,7 +24,7 @@
|
||||
}
|
||||
|
||||
/* ========== 头部统计 ========== */
|
||||
.cwd-comments-header {
|
||||
.cwd-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
@@ -33,7 +33,7 @@
|
||||
border-bottom: 1px solid var(--cwd-border);
|
||||
}
|
||||
|
||||
.cwd-comments-count {
|
||||
.cwd-count {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: var(--cwd-text);
|
||||
@@ -525,7 +525,7 @@
|
||||
min-height: 100px;
|
||||
}
|
||||
|
||||
.cwd-comments {
|
||||
.cwd {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
@@ -704,21 +704,21 @@
|
||||
}
|
||||
|
||||
/* 滚动条样式 */
|
||||
.cwd-comments-container::-webkit-scrollbar {
|
||||
.cwd-container::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
}
|
||||
|
||||
.cwd-comments-container::-webkit-scrollbar-track {
|
||||
.cwd-container::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.cwd-comments-container::-webkit-scrollbar-thumb {
|
||||
.cwd-container::-webkit-scrollbar-thumb {
|
||||
background: var(--cwd-border);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.cwd-comments-container::-webkit-scrollbar-thumb:hover {
|
||||
.cwd-container::-webkit-scrollbar-thumb:hover {
|
||||
background: var(--cwd-text-secondary);
|
||||
}
|
||||
|
||||
|
||||
@@ -14,7 +14,7 @@ export default defineConfig({
|
||||
name: 'CWDComments',
|
||||
entry: resolve(__dirname, 'src/index.js'),
|
||||
formats: ['umd'],
|
||||
fileName: (format) => `cwd-comments.js`,
|
||||
fileName: (format) => `cwd.js`,
|
||||
},
|
||||
rollupOptions: {
|
||||
output: {
|
||||
|
||||
Reference in New Issue
Block a user