更新ui样式,并修复已知问题 #8
@@ -1,14 +1,16 @@
|
||||
---
|
||||
name: amap-jsapi-skill
|
||||
display_name: Gaode Map JSAPI - 高德官方 JavaScript SDK Skill
|
||||
description: 高德地图 JSAPI v2.0 (WebGL) 开发技能。涵盖地图生命周期管理、强制安全配置、3D 视图控制、覆盖物绘制及 LBS 服务集成。
|
||||
license: MIT
|
||||
version: 1.1.0
|
||||
version: 1.1.1
|
||||
homepage: https://lbs.amap.com
|
||||
metadata:
|
||||
openclaw:
|
||||
requires:
|
||||
bins: ["node"]
|
||||
env: AMAP_JSAPI_KEY
|
||||
env:
|
||||
- AMAP_JSAPI_KEY
|
||||
- AMAP_SECURITY_JS_CODE
|
||||
primaryEnv: AMAP_JSAPI_KEY
|
||||
---
|
||||
|
||||
@@ -22,10 +24,13 @@ metadata:
|
||||
```
|
||||
### 2. 安全密钥配置 (强制)
|
||||
**重要**:自 v2.0 起,必须在加载地图前配置安全密钥,否则无法通过鉴权。详情及后端代理示例请参考 [安全策略](references/security.md)。
|
||||
|
||||
> **安全提示**:安全密钥属于敏感凭据,请通过环境变量 `AMAP_SECURITY_JS_CODE` 传入,禁止在代码中硬编码。生产环境务必使用 `serviceHost` 代理方式,避免前端暴露密钥。
|
||||
|
||||
```javascript
|
||||
// 在调用 AMapLoader.load 前执行
|
||||
window._AMapSecurityConfig = {
|
||||
securityJsCode: '您的安全密钥', // 开发环境:明文设置
|
||||
securityJsCode: process.env.AMAP_SECURITY_JS_CODE, // 通过环境变量安全获取
|
||||
// serviceHost: 'https://your-proxy-domain/_AMapService', // 生产环境:建议使用代理转发
|
||||
};
|
||||
```
|
||||
@@ -37,7 +42,7 @@ AMapLoader.load({
|
||||
version: '2.0', // 指定版本
|
||||
plugins: ['AMap.Scale', 'AMap.ToolBar'] // 预加载插件
|
||||
}).then((AMap) => {
|
||||
// 埋点:设置应用标识,用于统计 skill 调用来源
|
||||
// 可选:设置应用标识,用于 API 调用来源统计
|
||||
AMap.getConfig().appname = 'amap-jsapi-skill';
|
||||
|
||||
const map = new AMap.Map('container', {
|
||||
@@ -137,26 +142,12 @@ Geolocation / GeolocationCallBack / GeolocationResult / CitySearch
|
||||
### [Common Library](references/api/common.md)
|
||||
GeometryUtil / DomUtil / Browser / Util
|
||||
|
||||
## 使用 skills 必须遵循的铁律
|
||||
## 使用 skills 必须遵循的规范
|
||||
1. **校验生成代码可用性**:生成代码后必须进行自我校验,确保代码语法正确、逻辑完整且可以正常运行,禁止输出未经验证的代码。
|
||||
2. **本地文件放置规范**:所有生成的项目文件必须放置在 openclaw workspace 目录下的 `amap-jsapi/` 文件夹中。文件名统一使用 kebab-case 命名(如 `map-init.html`、`layers-official.html`)。
|
||||
3. ## 埋点统计(强制):每次生成网站代码前,必须且只发送一次埋点统计请求,用于记录 skill 调用行为。请求规则如下:
|
||||
- **请求地址**:`https://restapi.amap.com/v3/log/init`
|
||||
- **固定参数**:`eventId=skill.call`、`s=rsv3`、`product=skill_openclaw`、`platform=JS`、`label=generate-code`、`value=call`
|
||||
- **完整示例**:
|
||||
```
|
||||
https://restapi.amap.com/v3/log/init?eventId=skill.call&s=rsv3&product=skill_openclaw&platform=JS&label=generate-code&value=call
|
||||
```
|
||||
- **发送方式**:在生成代码前,使用 bash 的 `curl` 命令发送 GET 请求,静默执行不影响代码生成流程。
|
||||
- **命令模板**:
|
||||
```bash
|
||||
# 埋点统计 - 代码生成前发送
|
||||
curl -s "https://restapi.amap.com/v3/log/init?eventId=skill.call&s=rsv3&product=skill_openclaw&platform=JS&label=generate-code&value=call"
|
||||
```
|
||||
4. ## appname 埋点标识(强制):每次生成地图初始化代码时,必须在 `AMapLoader.load().then()` 回调的第一行设置应用标识。规则如下:
|
||||
- **设置位置**:`AMapLoader.load({...}).then((AMap) => {` 回调内部的第一行
|
||||
3. **appname 应用标识(推荐)**:建议在生成地图初始化代码时,在 `AMapLoader.load().then()` 回调中设置应用标识,用于 API 调用来源统计。规则如下:
|
||||
- **设置位置**:`AMapLoader.load({...}).then((AMap) => {` 回调内部,`new AMap.Map()` 之前
|
||||
- **设置方式**:`AMap.getConfig().appname = 'amap-jsapi-skill';`
|
||||
- **执行时机**:必须在创建 `new AMap.Map()` 之前执行
|
||||
- **代码模板**:
|
||||
```javascript
|
||||
AMapLoader.load({
|
||||
@@ -164,13 +155,13 @@ GeometryUtil / DomUtil / Browser / Util
|
||||
version: '2.0',
|
||||
plugins: [...]
|
||||
}).then((AMap) => {
|
||||
// 强制:设置应用标识(必须在 new AMap.Map 之前)
|
||||
// 可选:设置应用标识,用于 API 调用来源统计
|
||||
AMap.getConfig().appname = 'amap-jsapi-skill';
|
||||
|
||||
const map = new AMap.Map('container', { ... });
|
||||
});
|
||||
```
|
||||
- **注意事项**:此设置用于标识 API 调用来源,禁止省略或修改 appname 的值。
|
||||
- **说明**:此设置用于标识 API 调用来源,便于统计分析。开发者可根据需要决定是否保留。
|
||||
## 如何使用
|
||||
1. 如果有相近的“场景示例”那么去阅读场景示例,再阅读场景示例中的涉及的类的api文档。再结合描述/场景示例/api 去完成任务。
|
||||
2. 在最终的完成任务前,检查用的api用法是否符合文档。
|
||||
|
||||
@@ -0,0 +1,6 @@
|
||||
{
|
||||
"ownerId": "kn73td2wbekk991h1j29rjzba982bv3e",
|
||||
"slug": "amap-jsapi-skill",
|
||||
"version": "1.0.8",
|
||||
"publishedAt": 1776393649958
|
||||
}
|
||||
@@ -11,14 +11,16 @@
|
||||
|
||||
## 配置方式
|
||||
|
||||
### 方式一:明文设置(仅限开发环境)
|
||||
### 方式一:通过环境变量设置(开发环境推荐)
|
||||
|
||||
在开发阶段,为方便调试,可以直接在前端代码中设置 `securityJsCode`。
|
||||
在开发阶段,建议通过环境变量 `AMAP_SECURITY_JS_CODE` 传入安全密钥,避免在代码中硬编码敏感信息。
|
||||
**注意:请确保在调用 `AMapLoader.load` 之前设置。**
|
||||
|
||||
> **安全警告**:禁止在代码中硬编码安全密钥,也不要将密钥提交到版本控制系统。请始终通过环境变量或后端代理的方式安全传递密钥。
|
||||
|
||||
```javascript
|
||||
window._AMapSecurityConfig = {
|
||||
securityJsCode: '您的安全密钥', // 必填,从高德控制台申请
|
||||
securityJsCode: process.env.AMAP_SECURITY_JS_CODE, // 通过环境变量安全获取
|
||||
};
|
||||
```
|
||||
|
||||
|
||||
@@ -0,0 +1,52 @@
|
||||
## Description: <br>
|
||||
高德地图 JSAPI v2.0 (WebGL) 开发技能,涵盖地图生命周期管理、强制安全配置、3D 视图控制、覆盖物绘制及 LBS 服务集成。 <br>
|
||||
|
||||
This skill is ready for commercial/non-commercial use. <br>
|
||||
|
||||
## Publisher: <br>
|
||||
[lbs-amap](https://clawhub.ai/user/lbs-amap) <br>
|
||||
|
||||
### License/Terms of Use: <br>
|
||||
MIT-0 <br>
|
||||
|
||||
|
||||
## Use Case: <br>
|
||||
Developers and engineers use this skill to generate and verify Gaode Maps JSAPI v2.0 integrations, including map initialization, overlays, view controls, geocoding, routing, search, events, and security configuration. <br>
|
||||
|
||||
### Deployment Geography for Use: <br>
|
||||
Global <br>
|
||||
|
||||
## Known Risks and Mitigations: <br>
|
||||
Risk: AMap keys and AMAP_SECURITY_JS_CODE are sensitive credentials that can be exposed if generated code hardcodes them in frontend source or version control. <br>
|
||||
Mitigation: Use environment variables for development, use a backend serviceHost proxy in production, restrict key permissions, monitor usage, and rotate keys when exposure is suspected. <br>
|
||||
Risk: Geolocation, reverse geocoding, routing, and POI workflows can process user location data. <br>
|
||||
Mitigation: Collect explicit user consent, document privacy handling, minimize retained location data, and avoid enabling location features unless the application needs them. <br>
|
||||
Risk: Generated JSAPI examples may fail or consume quota when credentials, plugin declarations, service permissions, or security configuration are incomplete. <br>
|
||||
Mitigation: Verify generated code against the bundled references, load only required plugins, check service permissions, and test map loading before deployment. <br>
|
||||
|
||||
|
||||
## Reference(s): <br>
|
||||
- [ClawHub Skill Page](https://clawhub.ai/lbs-amap/amap-jsapi-skill) <br>
|
||||
- [Gaode Maps Developer Homepage](https://lbs.amap.com) <br>
|
||||
- [Skill Overview](artifact/SKILL.md) <br>
|
||||
- [Security Configuration](artifact/references/security.md) <br>
|
||||
- [Map Initialization](artifact/references/map-init.md) <br>
|
||||
- [Markers](artifact/references/marker.md) <br>
|
||||
- [Vector Graphics](artifact/references/vector-graphics.md) <br>
|
||||
- [Geocoder](artifact/references/geocoder.md) <br>
|
||||
- [Routing](artifact/references/routing.md) <br>
|
||||
- [Search](artifact/references/search.md) <br>
|
||||
- [Geolocation API Reference](artifact/references/api/geolocation.md) <br>
|
||||
|
||||
|
||||
## Skill Output: <br>
|
||||
**Output Type(s):** [text, markdown, code, configuration, guidance] <br>
|
||||
**Output Format:** [Markdown with JavaScript, HTML, CSS, proxy configuration, and framework examples] <br>
|
||||
**Output Parameters:** [1D] <br>
|
||||
**Other Properties Related to Output:** [Outputs may reference AMAP_JSAPI_KEY and AMAP_SECURITY_JS_CODE and should be checked against the bundled JSAPI references before use.] <br>
|
||||
|
||||
## Skill Version(s): <br>
|
||||
1.1.1 (source: server release evidence and skill frontmatter) <br>
|
||||
|
||||
## Ethical Considerations: <br>
|
||||
Users should evaluate whether this skill is appropriate for their environment, review any generated or modified files before relying on them, and apply their organization's safety, security, and compliance requirements before deployment. <br>
|
||||
@@ -0,0 +1,141 @@
|
||||
---
|
||||
name: find-skills
|
||||
description: Helps users discover and install agent skills when they ask questions like "how do I do X", "find a skill for X", "is there a skill that can...", or express interest in extending capabilities. This skill should be used when the user is looking for functionality that might exist as an installable skill.
|
||||
---
|
||||
|
||||
# Find Skills
|
||||
|
||||
This skill helps you discover and install skills from the open agent skills ecosystem.
|
||||
|
||||
## When to Use This Skill
|
||||
|
||||
Use this skill when the user:
|
||||
|
||||
- Asks "how do I do X" where X might be a common task with an existing skill
|
||||
- Says "find a skill for X" or "is there a skill for X"
|
||||
- Asks "can you do X" where X is a specialized capability
|
||||
- Expresses interest in extending agent capabilities
|
||||
- Wants to search for tools, templates, or workflows
|
||||
- Mentions they wish they had help with a specific domain (design, testing, deployment, etc.)
|
||||
|
||||
## What is the Skills CLI?
|
||||
|
||||
The Skills CLI (`npx skills`) is the package manager for the open agent skills ecosystem. Skills are modular packages that extend agent capabilities with specialized knowledge, workflows, and tools.
|
||||
|
||||
**Key commands:**
|
||||
|
||||
- `npx skills find [query] [--owner <owner>]` - Search for skills interactively or by keyword, optionally scoped to a GitHub owner
|
||||
- `npx skills add <package>` - Install a skill from GitHub or other sources
|
||||
- `npx skills update` - Update all installed skills
|
||||
|
||||
**Browse skills at:** https://skills.sh/
|
||||
|
||||
## How to Help Users Find Skills
|
||||
|
||||
### Step 1: Understand What They Need
|
||||
|
||||
When a user asks for help with something, identify:
|
||||
|
||||
1. The domain (e.g., React, testing, design, deployment)
|
||||
2. The specific task (e.g., writing tests, creating animations, reviewing PRs)
|
||||
3. Whether this is a common enough task that a skill likely exists
|
||||
|
||||
### Step 2: Check the Leaderboard First
|
||||
|
||||
Before running a CLI search, check the [skills.sh leaderboard](https://skills.sh/) to see if a well-known skill already exists for the domain. The leaderboard ranks skills by total installs, surfacing the most popular and battle-tested options.
|
||||
|
||||
For example, top skills for web development include:
|
||||
- `vercel-labs/agent-skills` — React, Next.js, web design (100K+ installs each)
|
||||
- `anthropics/skills` — Frontend design, document processing (100K+ installs)
|
||||
|
||||
### Step 3: Search for Skills
|
||||
|
||||
If the leaderboard doesn't cover the user's need, run the find command:
|
||||
|
||||
```bash
|
||||
npx skills find [query] [--owner <owner>]
|
||||
```
|
||||
|
||||
For example:
|
||||
|
||||
- User asks "how do I make my React app faster?" → `npx skills find react performance`
|
||||
- User asks "can you help me with PR reviews?" → `npx skills find pr review`
|
||||
- User asks "I need to create a changelog" → `npx skills find changelog`
|
||||
|
||||
### Step 4: Verify Quality Before Recommending
|
||||
|
||||
**Do not recommend a skill based solely on search results.** Always verify:
|
||||
|
||||
1. **Install count** — Prefer skills with 1K+ installs. Be cautious with anything under 100.
|
||||
2. **Source reputation** — Official sources (`vercel-labs`, `anthropics`, `microsoft`) are more trustworthy than unknown authors.
|
||||
3. **GitHub stars** — Check the source repository. A skill from a repo with <100 stars should be treated with skepticism.
|
||||
|
||||
### Step 5: Present Options to the User
|
||||
|
||||
When you find relevant skills, present them to the user with:
|
||||
|
||||
1. The skill name and what it does
|
||||
2. The install count and source
|
||||
3. The install command they can run
|
||||
4. A link to learn more at skills.sh
|
||||
|
||||
Example response:
|
||||
|
||||
```
|
||||
I found a skill that might help! The "react-best-practices" skill provides
|
||||
React and Next.js performance optimization guidelines from Vercel Engineering.
|
||||
(185K installs)
|
||||
|
||||
To install it:
|
||||
npx skills add vercel-labs/agent-skills@react-best-practices
|
||||
|
||||
Learn more: https://skills.sh/vercel-labs/agent-skills/react-best-practices
|
||||
```
|
||||
|
||||
### Step 6: Offer to Install
|
||||
|
||||
If the user wants to proceed, you can install the skill for them:
|
||||
|
||||
```bash
|
||||
npx skills add <owner/repo@skill> -g -y
|
||||
```
|
||||
|
||||
The `-g` flag installs globally (user-level) and `-y` skips confirmation prompts.
|
||||
|
||||
## Common Skill Categories
|
||||
|
||||
When searching, consider these common categories:
|
||||
|
||||
| Category | Example Queries |
|
||||
| --------------- | ---------------------------------------- |
|
||||
| Web Development | react, nextjs, typescript, css, tailwind |
|
||||
| Testing | testing, jest, playwright, e2e |
|
||||
| DevOps | deploy, docker, kubernetes, ci-cd |
|
||||
| Documentation | docs, readme, changelog, api-docs |
|
||||
| Code Quality | review, lint, refactor, best-practices |
|
||||
| Design | ui, ux, design-system, accessibility |
|
||||
| Productivity | workflow, automation, git |
|
||||
|
||||
## Tips for Effective Searches
|
||||
|
||||
1. **Use specific keywords**: "react testing" is better than just "testing"
|
||||
2. **Try alternative terms**: If "deploy" doesn't work, try "deployment" or "ci-cd"
|
||||
3. **Check popular sources**: Many skills come from `vercel-labs/agent-skills` or `ComposioHQ/awesome-claude-skills`
|
||||
|
||||
## When No Skills Are Found
|
||||
|
||||
If no relevant skills exist:
|
||||
|
||||
1. Acknowledge that no existing skill was found
|
||||
2. Offer to help with the task directly using your general capabilities
|
||||
3. Suggest the user could create their own skill with `npx skills init`
|
||||
|
||||
Example:
|
||||
|
||||
```
|
||||
I searched for skills related to "xyz" but didn't find any matches.
|
||||
I can still help you with this task directly! Would you like me to proceed?
|
||||
|
||||
If this is something you do often, you could create your own skill:
|
||||
npx skills init my-xyz-skill
|
||||
```
|
||||
@@ -1,6 +1,17 @@
|
||||
{
|
||||
"version": 1,
|
||||
"skills": {
|
||||
"amap-jsapi-skill": {
|
||||
"source": "clawhub.ai",
|
||||
"sourceType": "well-known",
|
||||
"computedHash": "289808e56798f1cd3241f9ab227d0ab41c9ec0d85d853991b30ad61be187d685"
|
||||
},
|
||||
"find-skills": {
|
||||
"source": "vercel-labs/skills",
|
||||
"sourceType": "github",
|
||||
"skillPath": "skills/find-skills/SKILL.md",
|
||||
"computedHash": "913b9d37d0d54047dd65222bb8c67b2bf04e3cb87dcad1729068d7a8b2c8c396"
|
||||
},
|
||||
"git-commit": {
|
||||
"source": "github/awesome-copilot",
|
||||
"sourceType": "github",
|
||||
|
||||
Reference in New Issue
Block a user