umbraco-bundle

安装量: 58
排名: #12858

安装

npx skills add https://github.com/umbraco/umbraco-cms-backoffice-skills --skill umbraco-bundle

Umbraco Bundle What is it? A Bundle is an extension type that points to a single JavaScript file that exports or re-exports Extension Manifests written in JavaScript/TypeScript. It serves as a container for grouping multiple extension manifests together, allowing you to declare manifests in code rather than JSON and organize extensions in a modular way. Documentation Always fetch the latest docs before implementing: Main docs : https://docs.umbraco.com/umbraco-cms/customizing/extending-overview/extension-types/bundle Foundation : https://docs.umbraco.com/umbraco-cms/customizing/foundation Extension Registry : https://docs.umbraco.com/umbraco-cms/customizing/extending-overview/extension-registry Workflow Fetch docs - Use WebFetch on the URLs above Ask questions - What extensions to bundle? TypeScript or JavaScript? Generate files - Create manifest + bundle file based on latest docs Explain - Show what was created and how to test Minimal Examples Manifest (umbraco-package.json) { "name" : "My Package" , "version" : "1.0.0" , "extensions" : [ { "type" : "bundle" , "alias" : "My.Package.Bundle" , "name" : "My Package Bundle" , "js" : "/App_Plugins/MyPackage/manifests.js" } ] } Bundle File (manifests.ts) import type { UmbExtensionManifest } from '@umbraco-cms/backoffice/extension-api' ; export const manifests : Array < UmbExtensionManifest

= [ { type : 'dashboard' , name : 'My Dashboard' , alias : 'My.Dashboard' , element : ( ) => import ( './dashboard.js' ) , weight : 900 , meta : { label : 'My Dashboard' , pathname : 'my-dashboard' , } , conditions : [ { alias : 'Umb.Condition.SectionAlias' , match : 'Umb.Section.Content' , } , ] , } , { type : 'headerApp' , name : 'My Header App' , alias : 'My.HeaderApp' , element : ( ) => import ( './header-app.js' ) , meta : { label : 'My App' , icon : 'icon-heart' , } , } , ] ; Re-exporting from Multiple Files // manifests.ts export * from './dashboards/manifests.js' ; export * from './header-apps/manifests.js' ; export * from './sections/manifests.js' ; That's it! Always fetch fresh docs, keep examples minimal, generate complete working code.

返回排行榜