Skip to content

Latest commit

 

History

History
255 lines (190 loc) · 8.62 KB

README.md

File metadata and controls

255 lines (190 loc) · 8.62 KB
Raw

Distributed Lab | Web-Kit

TypeScript-based various types of solutions for Distributed Lab projects and not only.

Table of Contents

Changelog

For the change log, see CHANGELOG.md.

Packages

The Distributed Lab Web-Kit is a library that consists of many smaller NPM packages within the @distributedlab namespace, a so-called monorepo.

Here are the packages in the namespace:

Package Description Latest
@distributedlab/reactivity Implementation of the reactivity connections to propagate changes between objects npm version
@distributedlab/jac A library for constructing JSON-API compliant requests and responses npm version
@distributedlab/tools Collection of common utility functions and classes npm version
@distributedlab/fetcher Fetch API wrapper with the extended functionality and simple interface npm version
@distributedlab/w3p The wrapper for web3 providers npm version

Using in the projects made by create-react-app

To use any of the packages in React project, created with create-react-app you need to add craco package and config to resolve the ESM version:

yarn add -D @craco/craco

Next, in the root of your project (where package.json is located) create a file named craco.config.js with the following content:

module.exports = {
  webpack: {
    configure: {
      module: {
        rules: [
          {
            test: /\.m?js$/,
            resolve: {
              fullySpecified: false,
            },
          },
        ],
      },
    },
  },
}

This config disables the breaking change that causes this error.

Then change the start/build/test commands in package.json replacing react-scripts to craco:

{
  "scripts": {
    "start": "craco start",
    "build": "craco build",
    "test": "craco test"
  }
}

Development

Editors

VSCode

To get ESLint and Prettier working in VSCode, install ESLint extension and add the following to your settings.json:

{
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },
  "editor.formatOnSave": true,
  "eslint.validate": [
    "javascript",
    "typescript"
  ],
  "eslint.alwaysShowStatus": true,
  "eslint.packageManager": "yarn",
  "eslint.workingDirectories": [{ "mode": "auto" }]
}

WebStorm

To get ESLint and Prettier working in WebStorm, go to Preferences > Languages & Frameworks > JavaScript > Code Quality Tools > ESLint and check the following:

  • Run eslint --fix on save enabled
  • Automatic ESLint configuration enabled
  • {**/*,*}.{js,ts} in Run for files field

Dependencies

Local dependencies

To install all dependencies, run:

yarn install

If you are implementing a new package which needs to depend on the local package, you can use the following command to install it:

yarn workspace @distributedlab/target-package add @distributedlab/package-to-add

To install a dependency to all packages, use the following command:

yarn workspaces foreach -pt run add @distributedlab/package-to-add

Testing dependencies

To test the packages, you need:

  1. Build the packages:

    yarn build

  2. Switch yarn to version berry in the project where you want to test package, to yarn be able to resolve workspace dependencies:

    yarn set version berry

  3. Add this to the .yarnrc.yml file:

    nodeLinker: node-modules

  4. Link the packages to the project:

    yarn link -p -A /path/to/web-kit/root/directory

  5. Add dependencies to the package.json file:

    {
  "dependencies": {
    "@distributedlab/jac": "*"
  }
}

  6. Install the dependencies:

    yarn install

Basics

Build

yarn build

Run tests

yarn test

Run linter

yarn lint

Check release version

yarn rsc 0.1.0

Bump version for all packages

yarn apply-version 0.1.0

Contribute

First off, thanks for taking the time to contribute! Now, take a moment to be sure your contributions make sense to everyone else.

Reporting Issues

Found a problem? Want a new feature? First of all see if your issue or idea has already been reported. If don't, just open a new clear and descriptive issue.

Submitting pull requests

Pull requests are the greatest contributions, so be sure they are focused in scope, and do avoid unrelated commits.

  • Fork it!
  • Clone your fork: git clone https://github.com/<your-username>/web-kit
  • Navigate to the newly cloned directory: cd web-kit
  • Create a new branch for the new feature: git checkout -b feature/my-new-feature
  • Install the tools necessary for development: yarn install
  • Make your changes.
  • Commit your changes: git commit -am 'Add some feature'
  • Push to the branch: git push origin feature/my-new-feature
  • Submit a pull request with full remarks documenting your changes.

License

MIT License © Distributed Lab

Resources