Skip to main content

Packages

Much like normal npm packages, LINCD packages bundle different functionality into one package.

Specifically a LINCD package can contain multiple Components, Shapes and Ontologies.

Creating a new package

Decide on a name for your package, go to a root directory in your terminal where you want the package to be created and run:

npx lincd-cli create-package [name]

then enter the newly created folder for your package and run yarn dev

Next, go ahead and create your first ontology, shape or component next!

Important files in a package

src/index.ts

This file simply imports all the files you want to bundle. When adding new components, ontologies or shapes to your package you will need to import them here.

The order in which you import files matters. It is recommended to import files in this order:

  1. ontologies
  2. components
  3. shapes

No exports from index

It is not recommended to export anything from index.ts. This way consumers of your package are encouraged to only use individual imports like your-package/lib/components/Foo which helps to reduce bundle sizes.

src/package.ts

This file creates and then exports decorators and helper functions that allow you to link components, shapes and ontologies to this package and to each other. You will need to import these decorators from this file in other files.

For example, a linked component is created using the @linkedComponent decorator, which is imported from ../package like so:

//src/components/testComponent.tsx import from /src/package.ts
import {linkedComponent} from '../package';

@linkedComponent(SomeShape)
export class TestComponent extends React.Component<any, any> {
//...
}

Registering your package on lincd.org

First reopen package.json and check that you've set the following fields. All of which are used to display information on lincd.org:

fieldnotes
nameA human friendly title for your package.
descriptionA plain text description of your package.
author & contributorsPlease use the object form with separate keys for name, email and url.
repositoryBy putting your component on github and filling in this field lincd.org will be able to show participants, avatars and other meta information about your package. Please use the object notation with a separate field for type and url.

When your package is complete, go ahead and run yarn publish. This will build minified bundles of your package and after uploading it to npm your package will be automatically registered in the LINCD registry.

You can also manually (re)register your package in the LINCD registry with

yarn lincd register