Early Adopter's guide to Umbraco v14 - Entry points

The Offical umbraco docs Show you how you can define all your elements (dashboards, property edirors, sections, etc) in the umbraco-package.json file.

For the purpose of our package template we are only using the umbraco-package.json file to define an Entry Point extension.

{
    "$schema": "../umbraco-package-schema.json",
    "name": "mypackage",
    "id": "mypackage",
    "version": "0.1.0",
    "allowTelemetry": true,
    "extensions": [
        {
            "name": "mypackage.entrypoint",
            "alias": "mypackage.EntryPoint",
            "type": "entryPoint",
            "js": "/app_plugins/mypackage/assets.js"
        }
    ]
}

This file is in the assets/public folder so is copied to to the wwwroot/app_plugins/packagename folder when the assets are built.

By using an entry point we are defining all our other elements in typescript. This gives us some advantages in the long run, because all our assets will be subject to the typescript compiler so we should catch errors as part of the build.

Entry point.

In Umbraco an entry point script is ran when the back office is initialized when the onInit method is called.

export const onInit: UmbEntryPointOnInit = 
    (_host, extensionRegistry) => {    
        // register them here. 
        extensionRegistry.registerMany(manifests);
};

In the default example here we register any manifests we might have already defined, and if the base template we have defined a dashboard manifest.

import { manifests as dashboardManifests } 
    from './dashboards/manifest.ts';

const manifests: Array<ManifestTypes> = [
    ...dashboardManifests
];

but you might add others such as sections or trees.

/ dashboards..
import { manifests as dashboardManifests } from 
    './dashboard/manifest.ts';
import { manifests as sectionManifests } from 
    './section/section.ts';

const manifests: Array<ManifestTypes> = [
    ...dashboardManifests,
    ...sectionManifests
];

This makes your entry point file the main point where you add new things to your package. and you don't need to alter the umbraco-package.json file again (except maybe for the version info?).

For the purpose of our samples (and how the Umbraco core appear to be doing it) we have manifest.ts files for each of the areas of our package we want to seperate out and they are then loaded into our main entry point - seperating it all out and preventing us from having to manager a single massive umbraco-package.json file.