🤗🧑🚀 A collection of tools to help you deploy, bundle HuggingFace Spaces and related assets with ease.
TypeScript
22
35 commits
updated Apr 15, 2026
A collection of tools to help you deploy, bundle HuggingFace Spaces and related assets with ease.
Where
hfupstands for HuggingFace up, and the wordupwas inspired fromrollup,tsup, you may think it means "to make your HuggingFace work up and running".
Pick the package manager of your choice:
ni hfup -D # from @antfu/ni, can be installed via `npm i -g @antfu/ni`
pnpm i hfup -D
yarn i hfup -D
npm i hfup -D
hfup can generate HuggingFace artifacts directly, without bundler hooks.
Quick start:
pnpm add -D hfup
Create hfup.config.json in your project root:
npx hfup generate --root . --outDir ./dist
This command writes:
.gitattributes (LFS patterns)README.md (Space or Model card front-matter + README content)You can also use a config file (hfup.config.json, hfup.config.mjs, hfup.config.js, hfup.config.cjs) in your project root or pass one explicitly via --config.
{
"$schema": "https://unpkg.com/hfup@latest/dist/json-schema.json",
"lfs": {
"withDefault": true,
"extraGlobs": ["*.gguf"],
"extraAttributes": ["data/**/*.bin filter=lfs diff=lfs merge=lfs -text"]
},
"spaceCard": {
"title": "My Space",
"license": "mit",
"emoji": "🚀",
"models": ["openai-community/gpt2"]
},
"modelCard": {
"language": ["en"],
"library_name": "transformers",
"pipeline_tag": "text-generation",
"base_model": "meta-llama/Llama-3.2-1B",
"license": "mit",
"tags": ["llm", "instruction-tuned"]
}
}
If you pin schema by version:
{
"$schema": "https://unpkg.com/hfup@1.0.0/dist/json-schema.json"
}
For projects that cannot use $schema inline, add a VS Code mapping in .vscode/settings.json:
{
"json.schemas": [
{
"fileMatch": ["hfup.config.json"],
"url": "https://unpkg.com/hfup@latest/dist/json-schema.json"
}
]
}
Optional flags:
--with-lfs: generate only .gitattributes--with-space-card: generate only README.md--with-model-card: generate only README.md--with-space-card and --with-model-card are mutually exclusive because both write README.md.
Generate model card only:
npx hfup generate --root . --outDir . --with-model-card
Generate space card only:
npx hfup generate --root . --outDir . --with-space-card
Generate only LFS:
npx hfup generate --root . --outDir . --with-lfs
Use the published JSON schema so non-TypeScript projects (Python/C/etc.) still get IntelliSense.
Inline schema in hfup.config.json:
{
"$schema": "https://unpkg.com/hfup@latest/dist/json-schema.json"
}
Or pin a version:
{
"$schema": "https://unpkg.com/hfup@1.0.0/dist/json-schema.json"
}
If you cannot use $schema inline, configure VS Code:
{
"json.schemas": [
{
"fileMatch": ["hfup.config.json"],
"url": "https://unpkg.com/hfup@latest/dist/json-schema.json"
}
]
}
You can generate a Hugging Face model card from bundler hooks too:
// vite.config.ts
import { defineConfig } from 'vite'
import { LFS, ModelCard } from 'hfup/vite'
export default defineConfig({
plugins: [
LFS(),
ModelCard({
language: ['en'],
library_name: 'transformers',
pipeline_tag: 'text-generation',
base_model: 'meta-llama/Llama-3.2-1B',
license: 'mit',
}),
],
})
// vite.config.ts
import { defineConfig } from 'vite'
import { LFS, SpaceCard } from 'hfup/vite'
export default defineConfig({
plugins: [
LFS(),
SpaceCard({
title: 'Real-time Whisper WebGPU (Vue)',
emoji: '🎤',
colorFrom: 'gray',
colorTo: 'green',
sdk: 'static',
pinned: false,
license: 'mit',
models: ['onnx-community/whisper-base'],
short_description: 'Yet another Real-time Whisper with WebGPU, written in Vue',
thumbnail: 'https://raw.githubusercontent.com/moeru-ai/airi/refs/heads/main/packages/whisper-webgpu/public/banner.png'
})
]
})
// rollup.config.js
import { LFS, SpaceCard } from 'hfup/rollup';
export default {
plugins: [
LFS(),
SpaceCard({
title: 'Real-time Whisper WebGPU (Vue)',
emoji: '🎤',
colorFrom: 'gray',
colorTo: 'green',
sdk: 'static',
pinned: false,
license: 'mit',
models: ['onnx-community/whisper-base'],
short_description: 'Yet another Real-time Whisper with WebGPU, written in Vue',
thumbnail: 'https://raw.githubusercontent.com/moeru-ai/airi/refs/heads/main/packages/whisper-webgpu/public/banner.png'
}),
],
};
// webpack.config.js
const { LFS, SpaceCard } = require("hfup/webpack");
module.exports = {
/* ... */
plugins: [
LFS(),
SpaceCard({
title: 'Real-time Whisper WebGPU (Vue)',
emoji: '🎤',
colorFrom: 'gray',
colorTo: 'green',
sdk: 'static',
pinned: false,
license: 'mit',
models: ['onnx-community/whisper-base'],
short_description: 'Yet another Real-time Whisper with WebGPU, written in Vue',
thumbnail: 'https://raw.githubusercontent.com/moeru-ai/airi/refs/heads/main/packages/whisper-webgpu/public/banner.png'
}),
],
};
// esbuild.config.js
import { build } from "esbuild";
import { LFS, SpaceCard } from "hfup/esbuild";
build({
/* ... */
plugins: [
LFS(),
SpaceCard({
title: 'Real-time Whisper WebGPU (Vue)',
emoji: '🎤',
colorFrom: 'gray',
colorTo: 'green',
sdk: 'static',
pinned: false,
license: 'mit',
models: ['onnx-community/whisper-base'],
short_description: 'Yet another Real-time Whisper with WebGPU, written in Vue',
thumbnail: 'https://raw.githubusercontent.com/moeru-ai/airi/refs/heads/main/packages/whisper-webgpu/public/banner.png'
}),
],
});
// rspack.config.mjs
import { LFS, SpaceCard } from "hfup/rspack";
/** @type {import('@rspack/core').Configuration} */
export default {
plugins: [
LFS(),
SpaceCard({
title: 'Real-time Whisper WebGPU (Vue)',
emoji: '🎤',
colorFrom: 'gray',
colorTo: 'green',
sdk: 'static',
pinned: false,
license: 'mit',
models: ['onnx-community/whisper-base'],
short_description: 'Yet another Real-time Whisper with WebGPU, written in Vue',
thumbnail: 'https://raw.githubusercontent.com/moeru-ai/airi/refs/heads/main/packages/whisper-webgpu/public/banner.png'
})
],
};
// rolldown.config.js
import { defineConfig } from "rolldown";
import { LFS, SpaceCard } from "hfup/rolldown";
export default defineConfig({
plugins: [
LFS(),
SpaceCard({
title: 'Real-time Whisper WebGPU (Vue)',
emoji: '🎤',
colorFrom: 'gray',
colorTo: 'green',
sdk: 'static',
pinned: false,
license: 'mit',
models: ['onnx-community/whisper-base'],
short_description: 'Yet another Real-time Whisper with WebGPU, written in Vue',
thumbnail: 'https://raw.githubusercontent.com/moeru-ai/airi/refs/heads/main/packages/whisper-webgpu/public/banner.png'
}),
],
});
.gitattributes file for Git LFS?README.md?hfup is here to help you!
.gitattributes file for Git LFS.README.md.README.md file and merge the front-matter header.README.md file right inside the outDir of build.After bundling, a dedicated README with merged front-matter header will be generated in the root of your project:
---
title: Real-time Whisper WebGPU (Vue)
emoji: 🎤
colorFrom: gray
colorTo: green
sdk: static
pinned: false
license: mit
models:
- onnx-community/whisper-base
short_description: Yet another Real-time Whisper with WebGPU, written in Vue
thumbnail: https://raw.githubusercontent.com/moeru-ai/airi/refs/heads/main/packages/whisper-webgpu/public/banner.png
---
# Real-time Whisper WebGPU (Vue)
TypeScript
99.5%
🤗🧑🚀 A collection of tools to help you deploy, bundle HuggingFace Spaces and related assets with ease.
TypeScript
22
35 commits
updated Apr 15, 2026
A collection of tools to help you deploy, bundle HuggingFace Spaces and related assets with ease.
Where
hfupstands for HuggingFace up, and the wordupwas inspired fromrollup,tsup, you may think it means "to make your HuggingFace work up and running".
Pick the package manager of your choice:
ni hfup -D # from @antfu/ni, can be installed via `npm i -g @antfu/ni`
pnpm i hfup -D
yarn i hfup -D
npm i hfup -D
hfup can generate HuggingFace artifacts directly, without bundler hooks.
Quick start:
pnpm add -D hfup
Create hfup.config.json in your project root:
npx hfup generate --root . --outDir ./dist
This command writes:
.gitattributes (LFS patterns)README.md (Space or Model card front-matter + README content)You can also use a config file (hfup.config.json, hfup.config.mjs, hfup.config.js, hfup.config.cjs) in your project root or pass one explicitly via --config.
{
"$schema": "https://unpkg.com/hfup@latest/dist/json-schema.json",
"lfs": {
"withDefault": true,
"extraGlobs": ["*.gguf"],
"extraAttributes": ["data/**/*.bin filter=lfs diff=lfs merge=lfs -text"]
},
"spaceCard": {
"title": "My Space",
"license": "mit",
"emoji": "🚀",
"models": ["openai-community/gpt2"]
},
"modelCard": {
"language": ["en"],
"library_name": "transformers",
"pipeline_tag": "text-generation",
"base_model": "meta-llama/Llama-3.2-1B",
"license": "mit",
"tags": ["llm", "instruction-tuned"]
}
}
If you pin schema by version:
{
"$schema": "https://unpkg.com/hfup@1.0.0/dist/json-schema.json"
}
For projects that cannot use $schema inline, add a VS Code mapping in .vscode/settings.json:
{
"json.schemas": [
{
"fileMatch": ["hfup.config.json"],
"url": "https://unpkg.com/hfup@latest/dist/json-schema.json"
}
]
}
Optional flags:
--with-lfs: generate only .gitattributes--with-space-card: generate only README.md--with-model-card: generate only README.md--with-space-card and --with-model-card are mutually exclusive because both write README.md.
Generate model card only:
npx hfup generate --root . --outDir . --with-model-card
Generate space card only:
npx hfup generate --root . --outDir . --with-space-card
Generate only LFS:
npx hfup generate --root . --outDir . --with-lfs
Use the published JSON schema so non-TypeScript projects (Python/C/etc.) still get IntelliSense.
Inline schema in hfup.config.json:
{
"$schema": "https://unpkg.com/hfup@latest/dist/json-schema.json"
}
Or pin a version:
{
"$schema": "https://unpkg.com/hfup@1.0.0/dist/json-schema.json"
}
If you cannot use $schema inline, configure VS Code:
{
"json.schemas": [
{
"fileMatch": ["hfup.config.json"],
"url": "https://unpkg.com/hfup@latest/dist/json-schema.json"
}
]
}
You can generate a Hugging Face model card from bundler hooks too:
// vite.config.ts
import { defineConfig } from 'vite'
import { LFS, ModelCard } from 'hfup/vite'
export default defineConfig({
plugins: [
LFS(),
ModelCard({
language: ['en'],
library_name: 'transformers',
pipeline_tag: 'text-generation',
base_model: 'meta-llama/Llama-3.2-1B',
license: 'mit',
}),
],
})
// vite.config.ts
import { defineConfig } from 'vite'
import { LFS, SpaceCard } from 'hfup/vite'
export default defineConfig({
plugins: [
LFS(),
SpaceCard({
title: 'Real-time Whisper WebGPU (Vue)',
emoji: '🎤',
colorFrom: 'gray',
colorTo: 'green',
sdk: 'static',
pinned: false,
license: 'mit',
models: ['onnx-community/whisper-base'],
short_description: 'Yet another Real-time Whisper with WebGPU, written in Vue',
thumbnail: 'https://raw.githubusercontent.com/moeru-ai/airi/refs/heads/main/packages/whisper-webgpu/public/banner.png'
})
]
})
// rollup.config.js
import { LFS, SpaceCard } from 'hfup/rollup';
export default {
plugins: [
LFS(),
SpaceCard({
title: 'Real-time Whisper WebGPU (Vue)',
emoji: '🎤',
colorFrom: 'gray',
colorTo: 'green',
sdk: 'static',
pinned: false,
license: 'mit',
models: ['onnx-community/whisper-base'],
short_description: 'Yet another Real-time Whisper with WebGPU, written in Vue',
thumbnail: 'https://raw.githubusercontent.com/moeru-ai/airi/refs/heads/main/packages/whisper-webgpu/public/banner.png'
}),
],
};
// webpack.config.js
const { LFS, SpaceCard } = require("hfup/webpack");
module.exports = {
/* ... */
plugins: [
LFS(),
SpaceCard({
title: 'Real-time Whisper WebGPU (Vue)',
emoji: '🎤',
colorFrom: 'gray',
colorTo: 'green',
sdk: 'static',
pinned: false,
license: 'mit',
models: ['onnx-community/whisper-base'],
short_description: 'Yet another Real-time Whisper with WebGPU, written in Vue',
thumbnail: 'https://raw.githubusercontent.com/moeru-ai/airi/refs/heads/main/packages/whisper-webgpu/public/banner.png'
}),
],
};
// esbuild.config.js
import { build } from "esbuild";
import { LFS, SpaceCard } from "hfup/esbuild";
build({
/* ... */
plugins: [
LFS(),
SpaceCard({
title: 'Real-time Whisper WebGPU (Vue)',
emoji: '🎤',
colorFrom: 'gray',
colorTo: 'green',
sdk: 'static',
pinned: false,
license: 'mit',
models: ['onnx-community/whisper-base'],
short_description: 'Yet another Real-time Whisper with WebGPU, written in Vue',
thumbnail: 'https://raw.githubusercontent.com/moeru-ai/airi/refs/heads/main/packages/whisper-webgpu/public/banner.png'
}),
],
});
// rspack.config.mjs
import { LFS, SpaceCard } from "hfup/rspack";
/** @type {import('@rspack/core').Configuration} */
export default {
plugins: [
LFS(),
SpaceCard({
title: 'Real-time Whisper WebGPU (Vue)',
emoji: '🎤',
colorFrom: 'gray',
colorTo: 'green',
sdk: 'static',
pinned: false,
license: 'mit',
models: ['onnx-community/whisper-base'],
short_description: 'Yet another Real-time Whisper with WebGPU, written in Vue',
thumbnail: 'https://raw.githubusercontent.com/moeru-ai/airi/refs/heads/main/packages/whisper-webgpu/public/banner.png'
})
],
};
// rolldown.config.js
import { defineConfig } from "rolldown";
import { LFS, SpaceCard } from "hfup/rolldown";
export default defineConfig({
plugins: [
LFS(),
SpaceCard({
title: 'Real-time Whisper WebGPU (Vue)',
emoji: '🎤',
colorFrom: 'gray',
colorTo: 'green',
sdk: 'static',
pinned: false,
license: 'mit',
models: ['onnx-community/whisper-base'],
short_description: 'Yet another Real-time Whisper with WebGPU, written in Vue',
thumbnail: 'https://raw.githubusercontent.com/moeru-ai/airi/refs/heads/main/packages/whisper-webgpu/public/banner.png'
}),
],
});
.gitattributes file for Git LFS?README.md?hfup is here to help you!
.gitattributes file for Git LFS.README.md.README.md file and merge the front-matter header.README.md file right inside the outDir of build.After bundling, a dedicated README with merged front-matter header will be generated in the root of your project:
---
title: Real-time Whisper WebGPU (Vue)
emoji: 🎤
colorFrom: gray
colorTo: green
sdk: static
pinned: false
license: mit
models:
- onnx-community/whisper-base
short_description: Yet another Real-time Whisper with WebGPU, written in Vue
thumbnail: https://raw.githubusercontent.com/moeru-ai/airi/refs/heads/main/packages/whisper-webgpu/public/banner.png
---
# Real-time Whisper WebGPU (Vue)
TypeScript
99.5%