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
Welcome to the demo samples repository for Syncfusion JavaScript Controls! This repository contains a collection of sample applications showcasing the usage of various Syncfusion Controls in a JavaScript environment.
4
4
5
-
Create your new folder in 'src' location and name the folder as control name. Example: “button” or "list-view".
5
+
## Prerequisites
6
6
7
-
Add your sample order in the `src/common/sampleOrder.json` with corresponding category.
7
+
-[Node.js](https://nodejs.org/en) - `v16+`
8
8
9
-
**Note:** Do not use whitespace at any cause in the folder’s name. Use “-” instead of space.
9
+
## Run the samples
10
10
11
+
To run the sample applications locally, follow these steps
11
12
12
-
### Configure the folder and sample
13
-
14
-
Create the “sample.json” file inside of your control folder. Create your sample html and js file in same folder also the html and js files should have the same names.
15
-
16
-
**Note:** Do not use whitespace at any cause in the file’s name. Use “-” instead of space.
17
-
18
-
19
-
### Configure Sample JSON
20
-
21
-
Configure your sample json file as like below code snippet.
**Note:** To exculde a sample in the device you need to set `hideOnDevice` as true for the sample json file.
38
-
39
-
**Fields Description:**
40
-
41
-
*_name :_ It can be any string that you want to show a component name.
42
-
43
-
*_directory :_ Specifies that your sample's directory name.
44
-
45
-
*_category :_ Specify that your sample comes under which category.
46
-
47
-
*_dataSourcePath :_ Specify that your data source file Path (Optional).
48
-
49
-
*_samples :_ Specify array of samples in your control.
50
-
51
-
*_samples.url :_ specifies the file name without extension.
52
-
53
-
*_samples.name :_ It can be any string that you want to show a sample name.
54
-
55
-
*_samples.category :_ Specify that your sample comes under which category.
56
-
57
-
58
-
## Adding datasource components
59
-
60
-
To add datasource file for the component, you need to include the `dataSourcePath` option which need to map the datasource file path in the component's sample.json.
**Note:** Each component should include one datasource file only.
77
-
78
-
## Run the sample browser
79
-
80
-
We can run the sample browser with two commands
81
-
82
-
1.**gulp _serve_** – run the sample browser alone.
83
-
2.**gulp _watch_** – run the sample browser and monitor typescript as well. This will help at development time. If any changes detect means it will automatically compile and browser will reloaded.
84
-
85
-
```
21
+
```bash
86
22
gulp serve
87
23
```
88
24
89
-
90
-
**Access URLs:**
91
-
92
-
Local URL is works only in your machine.
93
-
94
-
```
95
-
http://localhost:3000
96
-
```
97
-
98
-
External URL is works in all locally connected LAN. (You can use to see sample browser in mobile).
99
-
100
-
```
101
-
http://your-ip-address:3000
102
-
```
103
-
104
-
**Note:** Here, The mentioned IP is your local machine IP Address.
25
+
3. Open your web browser and navigate to the specified localhost address to view the samples.
<ahref='https://www.syncfusion.com/downloads?tag=es-seo-ej2-javascript-es5-demo-menu-trail' target="_blank" aria-label="Free Trail (Opens in a new window)">
0 commit comments