Skip to content

Commit

Permalink
Merge pull request #34 from ant-design/docs/clean
Browse files Browse the repository at this point in the history
📝 docs: 更新通义千问使用文档并添加 demos
  • Loading branch information
ONLY-yours authored Jan 11, 2024
2 parents 274784d + 032e063 commit d184e08
Show file tree
Hide file tree
Showing 14 changed files with 483 additions and 15 deletions.
8 changes: 7 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,13 @@ $ pnpm install @ant-design/pro-chat
```js
const nextConfig = {
transpilePackages: ['@ant-design/pro-chat'],
transpilePackages: [
'@ant-design/pro-chat',
'@ant-design/pro-editor',
'zustand',
'react-intersection-observer',
'leva',
],
};
```

Expand Down
30 changes: 18 additions & 12 deletions README.zh-CN.md
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,13 @@ $ pnpm install @ant-design/pro-chat
```js
const nextConfig = {
transpilePackages: ['@ant-design/pro-chat'],
transpilePackages: [
'@ant-design/pro-chat',
'@ant-design/pro-editor',
'zustand',
'react-intersection-observer',
'leva',
],
};
```

Expand Down Expand Up @@ -82,7 +88,7 @@ export default () => (
>
> ProChat 专注于快速搭建起大语言模型 Chat 对话框架。它旨在赋予开发人员轻松打造丰富、动态和直观的聊天界面的能力。
[![](https://next.ossinsight.io/widgets/official/compose-activity-trends/thumbnail.png?repo_id=707504998\&image_size=auto\&color_scheme=dark)](https://next.ossinsight.io/widgets/official/compose-activity-trends?repo_id=707504998)
[![](https://next.ossinsight.io/widgets/official/compose-activity-trends/thumbnail.png?repo_id=707504998&image_size=auto&color_scheme=dark)](https://next.ossinsight.io/widgets/official/compose-activity-trends?repo_id=707504998)

**聊天界面组件的框架和解决方案:**

Expand All @@ -107,13 +113,13 @@ export default () => (

让我们展示一些 ProChat 的标志性能力:

| **流式对话** | **内容编辑器** |
| :----------------: | :-----------: |
| 流式对话,输出丝滑流畅 | 实时编辑完善你的对话 |
| ![][prevew-1] | ![][prevew-3] |
| **集成渲染器** | |
| 内容多功能 Markdown 渲染器 | |
| ![][prevew-2] | |
| **流式对话** | **内容编辑器** |
| :------------------------: | :------------------: |
| 流式对话,输出丝滑流畅 | 实时编辑完善你的对话 |
| ![][prevew-1] | ![][prevew-3] |
| **集成渲染器** | |
| 内容多功能 Markdown 渲染器 | |
| ![][prevew-2] | |

<br/>

Expand All @@ -124,9 +130,9 @@ export default () => (
> - 现代浏览器和 Internet Explorer 11(需要[兼容性填充](https://stackoverflow.com/questions/57020976/polyfills-in-2019-for-ie11)
> - [Electron](https://www.electronjs.org/)
| [![edge](https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png)](http://godban.github.io/browsers-support-badges/) | [![Edge](https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png)](http://godban.github.io/browsers-support-badges/) | [![chrome](https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png)](http://godban.github.io/browsers-support-badges/) | [![safari](https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png)](http://godban.github.io/browsers-support-badges/) | [![electron\_48x48](https://raw.githubusercontent.com/alrra/browser-logos/master/src/electron/electron_48x48.png)](http://godban.github.io/browsers-support-badges/) |
| ------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Edge | 最近 2 个版本 | 最近 2 个版本 | 最近 2 个版本 | 最近 2 个版本 |
| [![edge](https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png)](http://godban.github.io/browsers-support-badges/) | [![Edge](https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png)](http://godban.github.io/browsers-support-badges/) | [![chrome](https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png)](http://godban.github.io/browsers-support-badges/) | [![safari](https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png)](http://godban.github.io/browsers-support-badges/) | [![electron_48x48](https://raw.githubusercontent.com/alrra/browser-logos/master/src/electron/electron_48x48.png)](http://godban.github.io/browsers-support-badges/) |
| --- | --- | --- | --- | --- |
| Edge | 最近 2 个版本 | 最近 2 个版本 | 最近 2 个版本 | 最近 2 个版本 |

<br/>

Expand Down
36 changes: 36 additions & 0 deletions demos/qwen-nextjs/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).

## Getting Started

First, run the development server:

```bash
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev
```

Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.

You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.

This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.

## Learn More

To learn more about Next.js, take a look at the following resources:

- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.

You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!

## Deploy on Vercel

The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.

Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
5 changes: 5 additions & 0 deletions demos/qwen-nextjs/next-env.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
/// <reference types="next" />
/// <reference types="next/image-types/global" />

// NOTE: This file should not be edited
// see https://nextjs.org/docs/basic-features/typescript for more information.
12 changes: 12 additions & 0 deletions demos/qwen-nextjs/next.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
/** @type {import('next').NextConfig} */
const nextConfig = {
transpilePackages: [
'@ant-design/pro-editor',
'@ant-design/pro-chat',
'zustand',
'react-intersection-observer',
'leva',
],
};

module.exports = nextConfig;
28 changes: 28 additions & 0 deletions demos/qwen-nextjs/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
{
"name": "qwen-nextjs",
"version": "0.1.0",
"private": true,
"scripts": {
"build": "next build",
"dev": "next dev",
"lint": "next lint",
"start": "next start"
},
"dependencies": {
"@ant-design/pro-chat": "^1.2.0",
"@ant-design/pro-editor": "^0.38.0",
"antd": "^5.12.8",
"antd-style": "^3.6.1",
"next": "14.0.4",
"react": "^18",
"react-dom": "^18"
},
"devDependencies": {
"@types/node": "^20",
"@types/react": "^18",
"@types/react-dom": "^18",
"eslint": "^8",
"eslint-config-next": "14.0.4",
"typescript": "^5"
}
}
107 changes: 107 additions & 0 deletions demos/qwen-nextjs/src/app/globals.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,107 @@
:root {
--max-width: 1100px;
--border-radius: 12px;
--font-mono: ui-monospace, Menlo, Monaco, 'Cascadia Mono', 'Segoe UI Mono',
'Roboto Mono', 'Oxygen Mono', 'Ubuntu Monospace', 'Source Code Pro',
'Fira Mono', 'Droid Sans Mono', 'Courier New', monospace;

--foreground-rgb: 0, 0, 0;
--background-start-rgb: 214, 219, 220;
--background-end-rgb: 255, 255, 255;

--primary-glow: conic-gradient(
from 180deg at 50% 50%,
#16abff33 0deg,
#0885ff33 55deg,
#54d6ff33 120deg,
#0071ff33 160deg,
transparent 360deg
);
--secondary-glow: radial-gradient(
rgba(255, 255, 255, 1),
rgba(255, 255, 255, 0)
);

--tile-start-rgb: 239, 245, 249;
--tile-end-rgb: 228, 232, 233;
--tile-border: conic-gradient(
#00000080,
#00000040,
#00000030,
#00000020,
#00000010,
#00000010,
#00000080
);

--callout-rgb: 238, 240, 241;
--callout-border-rgb: 172, 175, 176;
--card-rgb: 180, 185, 188;
--card-border-rgb: 131, 134, 135;
}

@media (prefers-color-scheme: dark) {
:root {
--foreground-rgb: 255, 255, 255;
--background-start-rgb: 0, 0, 0;
--background-end-rgb: 0, 0, 0;

--primary-glow: radial-gradient(rgba(1, 65, 255, 0.4), rgba(1, 65, 255, 0));
--secondary-glow: linear-gradient(
to bottom right,
rgba(1, 65, 255, 0),
rgba(1, 65, 255, 0),
rgba(1, 65, 255, 0.3)
);

--tile-start-rgb: 2, 13, 46;
--tile-end-rgb: 2, 5, 19;
--tile-border: conic-gradient(
#ffffff80,
#ffffff40,
#ffffff30,
#ffffff20,
#ffffff10,
#ffffff10,
#ffffff80
);

--callout-rgb: 20, 20, 20;
--callout-border-rgb: 108, 108, 108;
--card-rgb: 100, 100, 100;
--card-border-rgb: 200, 200, 200;
}
}

* {
box-sizing: border-box;
padding: 0;
margin: 0;
}

html,
body {
max-width: 100vw;
overflow-x: hidden;
}

body {
color: rgb(var(--foreground-rgb));
background: linear-gradient(
to bottom,
transparent,
rgb(var(--background-end-rgb))
)
rgb(var(--background-start-rgb));
}

a {
color: inherit;
text-decoration: none;
}

@media (prefers-color-scheme: dark) {
html {
color-scheme: dark;
}
}
18 changes: 18 additions & 0 deletions demos/qwen-nextjs/src/app/layout.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
import type { Metadata } from 'next';
import { Inter } from 'next/font/google';
import './globals.css';

const inter = Inter({ subsets: ['latin'] });

export const metadata: Metadata = {
title: 'Create Next App',
description: 'Generated by create next app',
};

export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
<html lang="en">
<body className={inter.className}>{children}</body>
</html>
);
}
30 changes: 30 additions & 0 deletions demos/qwen-nextjs/src/app/page.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
'use client';

import { ProChat } from '@ant-design/pro-chat';
import { useTheme } from 'antd-style';

export default function Home() {
const theme = useTheme();
return (
<div
style={{
backgroundColor: theme.colorBgLayout,
}}
>
<ProChat
style={{
height: '100vh',
width: '100vw',
}}
request={async (messages) => {
const response = await fetch('/api/qwen', {
method: 'POST',
body: JSON.stringify({ messages: messages }),
});
const data = await response.json();
return new Response(data.output?.text);
}}
/>
</div>
);
}
35 changes: 35 additions & 0 deletions demos/qwen-nextjs/src/app/qwen/route.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
import { NextResponse } from 'next/server';

export async function POST(request: Request) {
const { messages = [] }: Partial<{ messages: Array<any> }> = await request.json();
try {
const apiKey = 'Your-Api-Key'; // 你的 API 密钥
const response = await fetch(
'https://dashscope.aliyuncs.com/api/v1/services/aigc/text-generation/generation',
{
method: 'POST',
headers: {
Authorization: 'Bearer ' + apiKey,
'Content-Type': 'application/json',
},
body: JSON.stringify({
model: 'qwen-turbo',
input: {
messages: [
{
role: 'system',
content: 'You are a helpful assistant.',
},
...messages,
],
},
parameters: {},
}),
},
);
const data = await response.json();
return NextResponse.json(data);
} catch (error) {
return NextResponse.error();
}
}
27 changes: 27 additions & 0 deletions demos/qwen-nextjs/tsconfig.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
{
"compilerOptions": {
"target": "es5",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
"strict": true,
"noEmit": true,
"esModuleInterop": true,
"module": "esnext",
"moduleResolution": "bundler",
"resolveJsonModule": true,
"isolatedModules": true,
"jsx": "preserve",
"incremental": true,
"plugins": [
{
"name": "next"
}
],
"paths": {
"@/*": ["./src/*"]
}
},
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
"exclude": ["node_modules"]
}
11 changes: 11 additions & 0 deletions docs/guide/error.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
---
title: 错误处理
order: 2
group:
title: 快速上手
order: 2
---

# 错误处理

> Working on Progress
Loading

0 comments on commit d184e08

Please sign in to comment.