You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
1.**Evaluation version**publicly available on npm, includes a trial watermark, and can optionally be paired with a free evaluation period that grants access to technical support.
12
+
2.**Professional (commercial) version**available from the private DHTMLX npm repository and intended for production use.
Starting a formal evaluation gives you free technical support during the trial period.
40
+
41
+
**Downloading offline examples (zip)**
42
+
43
+
The evaluation form also includes downloadable ZIP containing offline-ready examples.
44
+
45
+
You can also explore additional examples and demo projects on the official GitHub by checking [Angular Gantt Demos on GitHub](https://github.com/DHTMLX/?q=angular-gantt&type=all&language=&sort=).
46
+
47
+
## Install The Professional Package (Private npm)
48
+
49
+
The Professional version is used for production applications and includes commercial licensing and full access to technical support.
31
50
32
-
Get private npm credentials in the [Client's Area](https://dhtmlx.com/clients/), then configure registry and login:
51
+
Once you obtain a commercial license, you can generate your private npm credentials in the [Client's Area](https://dhtmlx.com/clients/).
52
+
53
+
After generating your login/password, configure npm:
33
54
34
55
~~~bash
35
56
npm config set @dhx:registry=https://npm.dhtmlx.com
@@ -126,6 +149,51 @@ import { DhxGanttModule } from '@dhtmlx/trial-angular-gantt';
126
149
exportclassAppModule {}
127
150
~~~
128
151
152
+
## Moving from the trial package to the commercial one
153
+
154
+
Most projects start on the trial package and switch later, once the prototype is approved and a commercial license is in place. Both packages share the same API, so the move is mostly mechanical: swap the package name, swap the CSS import, and reinstall.
155
+
156
+
After you've configured the private registry as shown above, update every import in the code:
Search the project for any remaining mentions of `@dhtmlx/trial-angular-gantt`, including the CSS import path - that one is the easiest to forget. Replace the dependency in `package.json`, then `npm install` and run the app. If the watermark is gone and the rest of the UI behaves identically, the swap is done.
177
+
178
+
### Using the registry from CI or shared build environments
179
+
180
+
`npm login` works fine on a developer machine, but CI runners and other shared build environments typically can't run an interactive login. For those, generate a non-interactive access token from a logged-in machine:
The token is printed once in the terminal output - copy it before closing the session, since it cannot be retrieved later. Then expose it through an `.npmrc` file that the build can read:
187
+
188
+
~~~ini
189
+
@dhx:registry=https://npm.dhtmlx.com
190
+
//npm.dhtmlx.com/:_authToken=${DHTMLX_NPM_TOKEN}
191
+
~~~
192
+
193
+
Set `DHTMLX_NPM_TOKEN` as a secret in the CI provider (GitHub Actions, GitLab, etc.) so the token never gets committed. The same pattern works for Docker builds - inject the token at build time rather than baking it into the image.
194
+
195
+
If `npm install` fails on CI with a 401 or 403 against `npm.dhtmlx.com`, the secret is either missing, expired, or the `.npmrc` file isn't where npm expects it (the project root is the safest location).
196
+
129
197
## What To Read Next
130
198
131
199
-[Quick Start with Angular Gantt](integrations/angular/quick-start.md)
Copy file name to clipboardExpand all lines: docs/integrations/vue/installation.md
+66-10Lines changed: 66 additions & 10 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -6,7 +6,12 @@ description: "How to install the evaluation or professional version of Vue Gantt
6
6
7
7
# Installing Vue Gantt
8
8
9
-
Use this page to install the official Vue wrapper package and pick the correct import paths.
9
+
Vue Gantt is available in two distributions:
10
+
11
+
1.**Evaluation version** publicly available on npm, includes a trial watermark, and can optionally be paired with a free evaluation period that grants access to technical support.
12
+
2.**Professional (commercial) version** available from the private DHTMLX npm repository and intended for production use.
13
+
14
+
Both packages contain the same API.
10
15
11
16
## Prerequisites
12
17
@@ -15,15 +20,10 @@ Use this page to install the official Vue wrapper package and pick the correct i
Starting a formal evaluation gives you free technical support during the trial period.
47
+
48
+
**Downloading offline examples (zip)**
49
+
50
+
The evaluation form also includes downloadable ZIP containing offline-ready examples.
51
+
52
+
You can also explore additional examples and demo projects on the official GitHub by checking [Vue Gantt Demos on GitHub](https://github.com/DHTMLX/?q=vue-gantt&type=all&language=&sort=).
53
+
39
54
## Install The Professional Package (Private npm)
40
55
41
-
Get private npm credentials in the [Client's Area](https://dhtmlx.com/clients/), then configure the registry and log in:
56
+
The Professional version is used for production applications and includes commercial licensing and full access to technical support.
57
+
58
+
Once you obtain a commercial license, you can generate your private npm credentials in the [Client's Area](https://dhtmlx.com/clients/).
59
+
60
+
After generating your login/password, configure npm:
42
61
43
62
~~~bash
44
63
npm config set @dhx:registry=https://npm.dhtmlx.com
## Moving from the trial package to the commercial one
97
+
98
+
Most projects start on the trial package and switch later, once the prototype is approved and a commercial license is in place. Both packages share the same API, so the move is mostly mechanical: swap the package name, swap the CSS import, and reinstall.
99
+
100
+
After you've configured the private registry as shown above, update every import in the code:
Search the project for any remaining mentions of `@dhtmlx/trial-vue-gantt`, including the CSS import path - that one is the easiest to forget. Replace the dependency in `package.json`, then `npm install` and run the app. If the watermark is gone and the rest of the UI behaves identically, the swap is done.
113
+
114
+
### Using the registry from CI or shared build environments
115
+
116
+
`npm login` works fine on a developer machine, but CI runners and other shared build environments typically can't run an interactive login. For those, generate a non-interactive access token from a logged-in machine:
The token is printed once in the terminal output - copy it before closing the session, since it cannot be retrieved later. Then expose it through an `.npmrc` file that the build can read:
123
+
124
+
~~~ini
125
+
@dhx:registry=https://npm.dhtmlx.com
126
+
//npm.dhtmlx.com/:_authToken=${DHTMLX_NPM_TOKEN}
127
+
~~~
128
+
129
+
Set `DHTMLX_NPM_TOKEN` as a secret in the CI provider (GitHub Actions, GitLab, etc.) so the token never gets committed. The same pattern works for Docker builds - inject the token at build time rather than baking it into the image.
130
+
131
+
If `npm install` fails on CI with a 401 or 403 against `npm.dhtmlx.com`, the secret is either missing, expired, or the `.npmrc` file isn't where npm expects it (the project root is the safest location).
132
+
77
133
## What To Read Next
78
134
79
135
-[Quick Start with Vue Gantt](integrations/vue/quick-start.md)
Copy file name to clipboardExpand all lines: docs/integrations/vue/quick-start.md
+21-4Lines changed: 21 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -6,9 +6,18 @@ description: "Step-by-step guide to render the official Vue Gantt wrapper in a V
6
6
7
7
# Quick Start with Vue Gantt
8
8
9
-
Use this quick start to render Vue Gantt in a Vue 3 + Vite app with a dedicated Gantt component and `data.save` callback wiring.
9
+
:::note
10
+
This tutorial covers the Vue wrapper included in the **Commercial, Enterprise, and Ultimate** editions of DHTMLX Gantt.
11
+
If you are using the **Individual** or **GPL** edition, follow the alternative guide:
12
+
[How to Start with Vue](integrations/vue/js-gantt-vue.md).
13
+
:::
10
14
11
-
If you're new to Vue, start with the official [Vue documentation](https://vuejs.org/guide/introduction.html). Check [a complete working project that follows this tutorial on GitHub](https://github.com/DHTMLX/vue-gantt-quick-start).
15
+
The **Vue Gantt** component is the official wrapper for **DHTMLX Gantt**.
16
+
This guide walks you through creating a small Vue 3 + Vite application and rendering a basic Gantt chart using the trial package.
17
+
18
+
If you're new to Vue, start with the official [Vue documentation](https://vuejs.org/guide/introduction.html).
19
+
20
+
Check [a complete working project that follows this tutorial on GitHub](https://github.com/DHTMLX/vue-gantt-quick-start).
12
21
13
22
## Prerequisites
14
23
@@ -29,13 +38,21 @@ If you prefer Yarn, replace the install step with `yarn`.
29
38
30
39
## 2. Install Vue Gantt
31
40
32
-
Install the evaluation package:
41
+
Install Vue Gantt as described in the [Vue Gantt installation guide](integrations/vue/installation.md).
42
+
43
+
In this tutorial we use the evaluation package:
33
44
34
45
~~~bash
35
46
npm install @dhtmlx/trial-vue-gantt
36
47
~~~
37
48
38
-
If you use the professional package, replace `@dhtmlx/trial-vue-gantt` with `@dhx/vue-gantt` in commands and imports.
49
+
or
50
+
51
+
~~~bash
52
+
yarn add @dhtmlx/trial-vue-gantt
53
+
~~~
54
+
55
+
If you already use the Professional package, replace `@dhtmlx/trial-vue-gantt` with `@dhx/vue-gantt` in the commands and imports.
0 commit comments