Developer Docs

C#Bot Custom JavaScript Library

This process is a temporary solution and will be improved in a future release. A future version of C#Bot will resolve this issue. Thank you for your patience.

This article walks through how to add custom JavaScript packages to your project. For this example, we’ll be adding the remarkable custom package to our application.

You will be required to interact with the following file(s):

File Name Description
package.json This file contains dependencies that are used in the the project.


C#Bot uses React as its client-side framework, which makes use of NodeJS, NPM and Yarn. React uses the package.json configuration file to help yarn know both what dependencies and packages should be installed from the NPM registry, along with how to install them. Dependencies can be installed from the command line using yarn install [package name], and the node packages manager will add them to React project’s package.json. Alternatively, dependencies can first be added to the package.json manually and later installed with the yarn add command.

Custom packages can be added to node modules by running yarn add <package name> or yarn add --save-dev <package name> in production and development environments respectively.

However, as this file is managed by the bot, any yarn install ... commands will put new package entries outside of the protected regions, which will be deleted whenever the bot rewrites the project. As such, manual entry of the package is required to ensure that the packages are inside protected regions. The warnings section at the bottom of this article provides more detail.


Here we will add remarkable as a new custom package in our React project.

  1. Open package.json located at clientside/package.json
  2. Locate the following code block:

     "//": [
         " protected region % [Add custom development dependencies here] off begin "
  3. Turn on the protected region by replacing off begin with on begin
  4. Add these lines below the code block:

     "remarkable": "^2.0.0",

    These version numbers are the latest at the time of writing. Your versions may vary.

  5. Your package.json should now look like this:

     "//": [
         " protected region % [Add custom development dependencies here] on begin "
     "remarkable": "^2.0.0",
  6. Open a new terminal and navigate to clientside.
  7. Run yarn install.
  8. You are now able to use ‘remarkable’ in your application code.


There are a few things to be careful of when adding a new custom package:

Was this article helpful?

Thanks for your feedback!

If you would like to tell us more, please click on the link below to send us a message with more details.







On this page

New to Codebots?

We know our software can be complicated, so we are always happy to have a chat if you have any questions.