Dev Pack Setup Questions

@tpbradley @dan
Ok guys, trying to understand devpack again, but it’s pretty confusing to me.

When I created a devpack following the video:

  • Whether there is only a single component or a bunch of components, do they always get placed inside of the ‘components’ folder?

  • I see two info.json files in my devpack. We need clear explanation of what the root one should contain vs the one within the component.

  • Should version and build both be a single integer number, like 1 in both?, as Tom didn’t give me a concrete example and of course docs are probably wrong.

  • If we are going to have you guys host the products is info.json ‘missing URL’ even needed? As I guess you guys will handle helping client w/ reinstalling, etc.

  • Is framework info.json, when an element uses a particular framework like Foundation, or is it meant to indicate something else? I didn’t understand this at all ‘You can use this key to group Elements from the same Framework togther.’
    Or maybe it’s to group a bunch of elements together in left panel, not sure.

  • What assets in info.json should be declared ?

  • Since I didn’t see an explanation, are things placed in assets folder supposed to be non-variable files? And files placed in templates folder are supposed to contain {{variables}}?

  • Do we put the hooks file in shared hooks folder as hooks.js and if there are more than one element, how does Elements know which file goes with which element?

  • Not sure if there is only one element in the pack, if we need to set up a hooks, assets, templates folders inside of the component?

  • Will shared templates folder support all the types specified in portal?

  • I think it would be a good idea that when a devpack is created it builds ALL folders and sets up dummy files, so we don’t have to spend hrs trying to figure out where everything needs to be put. (Stretch goal - take all files in a specified component during devpack creation and put them where they need to go)

@Bill Thanks for reporting all this. For brevity, I’ve updated the manual where necessary and included the relevant links below.

We also have a growing list of example element packs you can refer to here.

Yes, a pack can contain multiple things, components, themes (and more in the future). Any components should be placed in the components folder.

Note: You could have a pack that doesn’t contain any components, instead it could contain themes and other items.

See the manual
Element Pack info.json
Component info.json

Yes, both are integer values. See docs

No, missing url isn’t needed. Removed from docs.

framework key is no longer supported. Removed from docs

No assets need to be declared. Removed from docs

Yes, assets are copied, templates are processed. Updated docs here and here

See docs on shared hooks and component hooks

Are you referring to the shared directory? You only really need to use this if multiple components share the same assets or hooks.

For a single component you could add hooks/assets/templates within the component itself.

Yes. Shared templates for pageStart/pageEnd is on the list.

We’d prefer to avoid this, as it could lead to unused template files being deployed when a pack is published. Our goal is to enhance Elements by adding more controls for generating files as needed — for example, an option to “Add hooks file” when it’s required.

We could also look at adding an option to copy a custom component to an element pack.

2 Likes

Ok, great, it’s starting to make more sense. Some quick followups:

  • In docs, need to remove assets from key/value list in Components > Assets

  • Inside of the assets folder, in the example, there is a page folder. Can you explain what ‘page’ is meant to be used for and any other types that you are planning.

  • For component templates folder, is the intent for us to set up as Ex: a bodyEnd folder (js), headEnd folder (css) and index.html file?

  • For a single component in a devpack, can the id for the component and the devpack be the same thing?

Thanks, done!

Assets stored in the page folder will be deployed to page files during publish. Updated docs here

We may add support for deployment of assets at the site level, but it’s currently unsupported. To achieve this, use shared assets.

Yes, updated docs here

Yes you can, but I’d advise against it. It’s good practice to keep naming consistent, like this.

Pack: `com.domain.weatherpack`
Component: `com.domain.weatherpack.stormalert`

This would ensure you can easily add more components in the future, should you need to.

1 Like

Great.

  • What about the shared templates folder - what folders are allowed in there? And I’m guessing we wouldn’t put loose files in the root of templates, but let me know.

You can set up the “shared” folder with the following structure:

  • shared
    – assets
    – hooks
    – templates
    — bodyStart
    — bodyEnd
    — headEnd
    — headStart

Edit: Just remembered, this is already in the Docs here, and here. Let me know if you need further clarification.

For the shared templates files, the docs say only html, but I can envision the use of css, js and php template files as well.

See this post: DevPack Template FileType - Allow PHP - #2 by dan :slight_smile: