package.json

Bit's Pkg Aspect automates the management of the components' package.json files.

A package file is generated by the Pkg aspect in component capsules and workspace component links, and included in the generated package for each component.

An example of a generated package.json.

{
  "name": "@my-org/people.ui.avatar",
  "version": "1.0.4",
  "homepage": "https://bit.dev/my-org/people/ui/avatar",
  "main": "dist/index.js",
  "componentId": {
    "scope": "my-org.people",
    "name": "ui/avatar",
    "version": "1.0.4"
  },
  "dependencies": {
    "...": "^3.0.0"
  },
  "devDependencies": {
    "...": "12.20.4"
  },
  "peerDependencies": {
    "...": "12.0.0"
  },
  "license": "SEE LICENSE IN LICENSE"
}
CopiedCopy

Name

The package name corresponds to the component's 'component ID':

my-org.people/ui/avatar --> @my-org/people.ui.avatar
CopiedCopy

Package names can be modified to a different pattern (that corresponds differently to their component IDs), or set to concrete values.

Version

The package version is determined by the snap release version (whether it is set manually or automatically, by Bit).

bit tag ui/avatar --ver 2.0.0
CopiedCopy
{
  "name": "@my-org/people.ui.avatar",
  "version": "2.0.0"
  // ...
}
CopiedCopy

Main file

The mainFile property in the package.json correlates to the component's main File.

Dependencies

All dependency related properties are automated and handled by Bit the Dependency Resolver Aspect.

Component dependencies are detected and resolved from the node_modules directory.

Tracking a component with a main file

bit add path/to/button --main button.ts
CopiedCopy

The componentId property

The componentId property is used by Bit to associate packages in the node_modules directories to components. Packages that do not include this property would be considered by Bit as a generic package and won't be recognized as a Bit Component.