asset-canister

Deploy static frontend assets to Internet Computer asset canisters with certified serving.

Updated Apr 3, 2026
One-click install
npx skills add https://github.com/phukrit7171/Relationship-Smart-Contract-ICP --skill asset-canister-phukrit7171
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: asset-canister
Source: https://github.com/phukrit7171/Relationship-Smart-Contract-ICP/tree/main/.agents/skills/asset-canister
Command: npx skills add https://github.com/phukrit7171/Relationship-Smart-Contract-ICP --skill asset-canister-phukrit7171

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @icp-sdk/canisters, @icp-sdk/core.

What problem does it solve? Deploying a web frontend to the Internet Computer requires correctly configuring an asset canister, and common mistakes like wrong build directories, missing SPA fallback rules, or misconfigured raw access cause silent failures, 404s, or security exposure. ## Core Features & Use Cases - icp.yaml Configuration: Set up the @dfinity/asset-canister recipe with build commands and output directory so icp deploy builds and uploads your frontend automatically. - SPA Routing and Headers: Configure .ic-assets.json5 with index.html fallback, cache headers, security policies, and raw access control. - Programmatic Uploads: Upload, list, and delete assets from Node.js code using AssetManager from @icp-sdk/canisters, with automatic chunking for files over 1.9MB. - Use Case: You built a Vite/React app and want it served on-chain with certified responses. This Skill walks you through the recipe setup, SPA fallback, deployment, and verification via http_request calls. ## Quick Start Deploy my Vite frontend in the dist folder to an Internet Computer asset canister with SPA routing enabled.

Frequently Asked Questions about asset-canister

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I deploy a frontend to the Internet Computer?

Configure an asset canister in icp.yaml using the @dfinity/asset-canister recipe with your build commands and output directory, then run icp deploy. The CLI builds the project and uploads the directory contents to the canister.

How do I fix 404 errors on SPA routes in an asset canister?

Add a .ic-assets.json5 file to your build output with a rule matching **/* that sets enable_aliasing to true. This makes the asset canister serve index.html for paths with no matching file, enabling client-side routing.

Can I upload files to an asset canister from JavaScript code?

Yes, use AssetManager from @icp-sdk/canisters/assets with an HttpAgent from @icp-sdk/core. It supports store, list, and delete operations, and automatically chunks files larger than 1.9MB into parallel uploads.

What is the difference between certified and raw asset access on IC?

Certified access via icp.net lets HTTP gateways verify response integrity against subnet certification, while raw access via raw.icp.net skips verification and allows tampering. Set allow_raw_access to false in .ic-assets.json5 for sensitive assets.

Why does icp deploy fail with the assets sync step error?

icp-cli 0.3.0 removed the built-in type: assets sync step, so older manifests fail to load. Use the @dfinity/asset-canister recipe v2.2.1 or later, which generates a plugin-based sync step compatible with the new CLI.

Should I use --add-controller to give someone upload access to an asset canister?

No, controllers get full canister control including upgrades and deletion. Instead use grant_permission with the Commit role for deploy pipelines, Prepare for staging uploads, or ManagePermissions for managing other uploaders.