一键导入
deploy-to-hf-spaces
Deploy the article to a Hugging Face Space. Use when the user asks to deploy, push, publish, or update their Space on Hugging Face.
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
菜单
Deploy the article to a Hugging Face Space. Use when the user asks to deploy, push, publish, or update their Space on Hugging Face.
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
| name | deploy-to-hf-spaces |
| description | Deploy the article to a Hugging Face Space. Use when the user asks to deploy, push, publish, or update their Space on Hugging Face. |
Guide for deploying and updating a research article on Hugging Face Spaces.
git@hf.co)huggingface-cli loginVia CLI:
huggingface-cli repo create <username>/<space-name> --repo-type space --space_sdk docker
Or manually at https://huggingface.co/new-space (select Docker SDK).
git remote add space git@hf.co:spaces/<username>/<space-name>
git push space main
The Space will build automatically using the included Dockerfile and nginx.conf. Build typically takes 3-5 minutes.
git add -A
git commit -m "feat: describe your changes"
git push space main
If the Space history has diverged (e.g., after a factory reset or manual edit on HF):
git push space main --force
https://huggingface.co/spaces/<username>/<space-name>?v=<timestamp> to the URL to bypass CDN cacheHugging Face Spaces aggressively cache static assets. If changes don't appear after a successful build:
/_astro/*.css)git commit --allow-empty -m "chore: trigger rebuild"
git push space main
Social platforms (X/Twitter, LinkedIn, Slack, …) cache the share preview by
image URL and rarely re-fetch on their own. To force them to pick up a new
thumbnail, the OG image URL is fingerprinted with a short content hash:
…/thumb.auto.jpg?v=<hash>. The hash is derived from article.mdx, so the URL
only changes when the article changes.
App page (*.hf.space shares): handled automatically. src/pages/index.astro
computes the hash at build time, so og:image / twitter:image always carry the
current ?v=<hash>.
Space card (huggingface.co/spaces/... shares - this is what X scrapes when you
share the Space URL): driven by the thumbnail: field in README.md, which Hugging
Face reads from the committed file. Refresh it before deploying:
cd app && npm run og:sync # rewrites README thumbnail: with ?v=<hash>
cd .. && git add README.md && git commit -m "chore: refresh OG cache token" && git push space main
Notes:
?v= bump) is the only reliable way.The README.md YAML frontmatter must contain:
tags:
- research-article-template
NEVER remove this tag. It is used by the Research Article Gallery to list the article. Without it, the Space becomes invisible in the gallery.
---
title: "Article Title"
emoji: 📝
colorFrom: blue
colorTo: indigo
sdk: docker
app_port: 8080
header: mini
pinned: false
tags:
- research-article-template
---
| Field | Description |
|---|---|
title | Displayed in the Space card |
emoji | Emoji shown on the Space card |
colorFrom / colorTo | Gradient colors for the card header |
sdk: docker | Required - uses the Dockerfile for build |
app_port: 8080 | Required - nginx serves on 8080 |
header: mini | Compact header (recommended for articles) |
tags | Must include research-article-template |
| Problem | Solution |
|---|---|
| Build fails | Check build logs in the Factory tab. Common issue: missing dependencies in package.json |
| CSS/layout looks wrong | Cache issue - force rebuild with empty commit |
| Images not showing | If using Git LFS, ensure LFS files are pushed. Otherwise check image paths |
| PDF not generated | Playwright is included in Docker build; check build logs for errors |
| Space shows old content | Wait 2-3 min after build completes for CDN propagation, then hard refresh |
Configure article metadata via MDX frontmatter. Use when the user asks about titles, authors, affiliations, template variants, banner, DOI, PDF export, or any article.mdx frontmatter field.
Create self-contained D3 HTML embed charts for the research article template. Use when the user asks to create a chart, visualization, embed, D3 chart, line chart, bar chart, scatter plot, sankey diagram, or any data visualization as an HTML embed file.