Documentation
Primary version
Primary version
  • Cubbles documentation
  • First steps
    • Generate a project
    • Create a webpackage
    • Create an elementary component
    • Create a compound component
      • Compound slot initialization
  • Runtime extension - RTE
    • User guide
      • RTE Integration
      • The Cubbles TAG API
        • The Cubbles Dependency API
      • The Cubbles Javascript API
        • Interacting with Cubbles from the outside
        • Adding dynamic connections
        • Interacting with Elementary Cubbles from the inside
      • The RTE Processing
        • RTE initialization and rendering timeline
      • The Cubbles IFrame API
        • The Cubbles IFrame Resizer API
      • The Cubbles mutation based start event API
      • FAQs
        • How to manually resolve dependency conflicts?
        • How to create a component instance dynamically?
        • How to render HTML Markup coming from input slot?
        • How to replace a dependency when declaring a component instance?
        • How to synchronize multiple dataflows between component instances?
        • How to handle the copyValue flag for non serializable instances?
    • Contributor guide
      • CIF processing
  • Developing with the vanilla boilerplate
    • Creating a new project
    • Developing elementaries using the vanilla boilerplate
    • Developing compounds using the vanilla boilerplate
    • Using the vanilla boilerplate scripts
  • Coder devtools - CDT
    • User guide
      • Create Cubbles artifacts
      • Upload a Webpackage
      • Generate a README file
      • Rename an artifact
      • Configure network proxy
      • Validate the manifest.webpackage file
      • Change active webpackage
      • Bulk upload of webpackages
      • Release a webpackage
      • Update the RTE version of a webpackage
      • Prepare a webpackage to be released
      • Update webpackage to the next development version
      • Generate a test environment for a component
      • Testing Cubbles components
      • Validate sources
      • Create a demo webpackage
    • Contributor guide
      • Checklist for releasing a new webpackage.modelVersion
  • Terms and concepts
    • Webpackage
    • Artifacts
    • User roles
    • Base
Powered by GitBook
On this page
  • Purpose
  • Prerequisites
  • Process
  • Test
  1. First steps

Create a webpackage

PreviousGenerate a projectNextCreate an elementary component

Last updated 6 years ago

Purpose

To demonstrate how to create a webpackage using the .

Prerequisites

  • A Cubbles project was

  • The CDT is a available

Process

A Webpackage acts as a container for the different artifacts, i.e. components, apps and utilities. It is defined by a file called manifest.webpackage, which is a JSON file that describes the internal model of the webpackage and of its artifacts (Check for more info).

To create a Webpackage you should run the createWebpackage task, using the bash you should move to your project's root folder and then to the devtools sub folder. There you should run the task:

grunt +createWebpackage

After that, you should provide the following information:

  • A name for the webpackage, e.g. "my-first-webpackage"

  • A name

  • An email address

  • And (optionally) a webpackage groupId, as kind of namespace for your organization, e.g, com.my.organization

The new webpackage will be the active webpackage. If everything went well you will get a message similar to the following:

Running "+createWebpackage" task
? WebPackage name (e.g. 'my-package'): my-first-webpackage
? Your name (as the author of the package): John Doe
? Your eMail: john.doe@email.com
? WebPackage groupId (optional, expected to start with your reversed
mail-domain): org.john.doe
Note: The created Webpackage is the new 'activeWebpackage' (@see .workspace)

Done, without errors.

Note that at this stage it is possible to change some webpackage settings. This is not necessary or mandatory for this tutorial. A few possibilities will be mentioned here:

  • You can change the parameters of the .editorconfig file, for instance if you like working with a different indent_size.

  • You can add a .gitignore file inside your package folder when you want to specify files or folders that should be ignored by the git management.

  • If you want to use bower to download additional libraries in the future you can change the default download folder modifying the .bowerrc file.

Test

To test the webpackage (its artifacts), you should start a local webserver running the following command:

grunt +startWebserver

If everything goes well, the bash will display the following message:

Currently mapped Webpackage: org.john.doe.my-first-webpackage (@see ../webpackages/.workspace)

Running "cubx-http-server:dev" (cubx-http-server) task
Server running on http://localhost:8282/
Hit CTRL-C to stop the server

Then, your default web browser will open the url and show the root of the project folder. Now you can navigate your webpackage (same name as given above). It is provided with an artifact called docs, click on it and you will sea a page that allows you visualize the documentation (manifest) of your webpackage.

Coder DevTools (CDT)
generated
this
http://localhost:8282
Documentation page