Installing RevoGrid Pro

Private NPM

Install RevoGrid Pro from our private NPM Registry

1. Configure NPM Registry

First, configure npm to use the RevoGrid registry:

npm config set "@revolist:registry=https://npm.rv-grid.com"

The command npm config set @revolist:registry=https://npm.rv-grid.com is used to configure npm (Node Package Manager) to use a specific registry for packages that are scoped under the @revolist namespace.

npm login --registry=https://npm.rv-grid.com
Username: ***
Password: ***
Email: ***

---

2. Install RevoGrid Pro

Install the RevoGrid and RevoGrid Pro packages:

npm install @revolist/revogrid
npm install @revolist/revogrid-pro

---

3. Framework Integration Packages

For better integration with specific frameworks, you can install the corresponding framework package:

React

npm install @revolist/react-datagrid

Angular

npm install @revolist/angular-datagrid

Vue

npm install @revolist/vue3-datagrid

Svelte

npm install @revolist/svelte-datagrid

Read more about RevoGrid Pro Tokens.

Pre-Built Version

For a quick setup, use the pre-built version from current Portal

Download Pre-Built Files

---

Option 1: Directly Include in Builds

• Copy the Download Pre-Built Files into your project’s assets or libs folder.
• Link the necessary JavaScript and CSS files in your HTML or import them into your JavaScript/TypeScript files.

<script src="path/to/revogrid-pro.js"></script>
<link rel="stylesheet" href="path/to/revogrid-pro.css" />

Or in your module-based project:

import 'path/to/revogrid-pro.js';
import 'path/to/revogrid-pro.css';

// If using build tools like Webpack or Vite:
// Add the ./release folder path to your resolve or alias configuration to reference the files.

resolve: {
  alias: {
    '@revogrid-pro': path.resolve(__dirname, 'path/to/release'),
  },
},

This option is particularly suitable for quick testing or projects that don’t rely on npm for dependency management.

---

Option 2: package.json Using Local Files

For projects where you want to use a local version of the RevoGrid Pro plugins during development, you can reference the plugin files directly in your package.json. This method is especially useful if you’re working with a cloned version of the repository or testing custom modifications.

Steps to Import Using Local Files:

1. Download files from the link above and extract them to a local folder.

2. Set Up the Local Reference in package.json. In your project’s package.json file, reference the local folder containing the RevoGrid Pro plugins. For example:

{
  "dependencies": {
    "@revolist/revogrid-pro": "file:./release"
  }
}

3. Install Dependencies. Run the following command to install the local plugin:

npm install

4. NPM will create a symlink to the specified folder, allowing you to use the local files as if they were an npm package. Use the Plugin in Your Project. Import the RevoGrid Pro plugins as you would with any npm package:

import { ColumnStretchPlugin } from '@revolist/revogrid-pro';

Github NPM

Install RevoGrid Pro from our private GitHub Package Registry

Private GitHub Registry

1. Ensure you have access to the GitHub repository.
2. Authenticate your npm client with GitHub by creating a .npmrc file in your project directory or user home directory with the following content:

@revolist:registry=https://npm.pkg.github.com/
//npm.pkg.github.com/:_authToken=YOUR_PERSONAL_ACCESS_TOKEN

3. Replace YOUR_PERSONAL_ACCESS_TOKEN with a GitHub token that has read:packages and repo permissions.
4. Install the package. Run the following command to install the latest version from the private package registry:

npm install @revolist/revogrid-pro@latest

For additional guidance on installing from GitHub’s private registry, please refer to the official GitHub Packages documentation.

Build from Source

For maximum control, you can build the RevoGrid Pro plugins from source.
This allows you to customize the build process if needed.

1. Clone the repository and navigate to the project directory:

git clone https://github.com/revolist/revogrid-pro.git
cd revogrid-pro

2. Run the build command to generate the plugin package:

npm run build:plugin

3. After the build completes, you’ll find the generated files in the /release/dist folder, ready for use in your project.

Choose the method that best suits your workflow, and enjoy the powerful features of RevoGrid Pro plugins!

Next Steps

After installation, you can start using RevoGrid Pro in your project. Check out our other guides for:

• Basic Usage
• Component API
• Simple Example

Each framework has its own set of components and examples that demonstrate how to use RevoGrid Pro effectively in your chosen framework environment.