A
add-expert
by @remotion-devv
4.3(120)
此技能能够自动化向 Remotion 专家页面添加新专家的流程。它处理图片上传、结构化数据录入(如姓名、社交链接、描述)以及专家卡片的自动生成,确保内容一致性并减少手动错误。通过此技能,用户可以高效地更新专家列表,无需深入了解代码库细节,从而加速内容发布和网站维护。
安装方式
npx skills add https://github.com/remotion-dev/remotion --skill add-expertcompare_arrows
Before / After 效果对比
1 组使用前
在没有此技能之前,开发者需要手动上传专家图片到指定目录,编辑 TSX 文件以添加结构化数据,并手动运行命令生成专家卡片。这个过程繁琐且容易因路径错误或数据格式不一致而导致问题,耗费大量时间。
使用后
此技能将整个专家信息录入流程自动化。开发者只需提供必要信息,该 Skill 即可自动处理图片放置、数据格式化和卡片生成,显著减少了手动操作和潜在错误,大幅提升了效率和准确性。
SKILL.md
Steps
-
Add the expert's photo to both:
packages/docs/static/img/freelancers/<firstname>.pngpackages/promo-pages/public/img/freelancers/<firstname>.png
The image should be a square headshot (PNG format). Both paths must have the same file.
-
Add an entry to the
expertsarray inpackages/promo-pages/src/components/experts/experts-data.tsx:{ slug: 'firstname-lastname', name: 'First Last', image: '/img/freelancers/<firstname>.png', website: 'https://example.com' | null, x: 'twitter_handle' | null, github: 'github_username' | null, linkedin: 'in/linkedin-slug/' | null, email: 'email@example.com' | null, videocall: 'https://cal.com/...' | null, since: new Date('YYYY-MM-DD').getTime(), description: ( <div> A short description of the expert's work and specialties. Links to projects can be included with <a> tags. </div> ), },sinceshould be set to today's dateslugmust be lowercase, hyphenated version of the name- Set unused social fields to
null - The entry goes at the end of the
expertsarray (before the closing])
-
Render the expert card by running in
packages/docs:bun render-cardsThis generates
packages/docs/static/generated/experts-<slug>.png. Verify it says "Rendered experts-<slug>" (not "Existed").
用户评价 (0)
发表评价
效果
易用性
文档
兼容性
暂无评价
统计数据
安装量2.4K
评分4.3 / 5.0
版本
更新日期2026年10月17日
对比案例1 组
用户评分
4.3(120)
5
37%
4
43%
3
13%
2
5%
1
2%
为此 Skill 评分
0.0
兼容平台
🤖claude-code
时间线
创建2026年6月13日
最后更新2026年10月17日