Skip to content

Commit e5e3993

Browse files
AishwaryaSingh123950AishwaryaSingh123950
authored
Added cdn approach in webpack example (#42)
* Added cdn approach in webpack example * Fixed biome formatting * Fix formatting * Fixes * Removed trailing whitespace * Created javascript-vite example * Formatting fix 1 * Formatting fix 2 * Removed drag and drop file selection and replaced it with simple pdf loading using url * Added one more sample pdf file
1 parent 9419db0 commit e5e3993

File tree

20 files changed

+2143
-60
lines changed

20 files changed

+2143
-60
lines changed

‎biome.json‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,12 @@
33
"files": {
44
"ignore": [
55
"examples/angular/.angular/cache/*",
6-
"./examples/*/public/*",
7-
"./examples/blazor/wasm/wwwroot/css/*",
8-
"./examples/wasm-benchmark/*",
9-
"./examples/asp-net/*",
10-
"./examples/svelte-kit",
11-
"./examples/salesforce/*"
6+
"examples/*/public/*",
7+
"examples/blazor/wasm/wwwroot/css/*",
8+
"examples/wasm-benchmark/*",
9+
"examples/asp-net/*",
10+
"examples/svelte-kit",
11+
"examples/salesforce/*"
1212
],
1313
"ignoreUnknown": true
1414
},

‎examples/javascript-vite/.gitignore‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
dist
2+
node_modules
3+
.DS_Store
4+
*.log
5+
.vite

‎examples/javascript-vite/LICENSE‎

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
The Nutrient sample applications are licensed with a modified BSD
2+
license. In plain language: you're allowed to do whatever you wish
3+
with the code, modify, redistribute, embed in your products (free or
4+
commercial), but you must include copyright, terms of usage and
5+
disclaimer as stated in the license.
6+
7+
You will require a commercial Nutrient License to run these examples
8+
in non-demo mode. Please refer to [email protected] for details.
9+
10+
Copyright © 2017-present PSPDFKit GmbH d/b/a Nutrient.
11+
All rights reserved.
12+
13+
Redistribution and use in source or binary forms,
14+
with or without modification, are permitted provided
15+
that the following conditions are met:
16+
17+
- Redistributions of source code must retain the above copyright
18+
notice, this list of conditions and the following disclaimer.
19+
20+
- Redistributions in binary form must reproduce the above copyright
21+
notice, this list of conditions and the following disclaimer in the
22+
documentation and/or other materials provided with the
23+
distribution.
24+
25+
- Redistributions of Nutrient samples must include attribution to
26+
Nutrient, either in documentation or other appropriate media.
27+
28+
- Neither the name of the Nutrient, PSPDFKit GmbH, nor its developers
29+
may be used to endorse or promote products derived from
30+
this software without specific prior written permission.
31+
32+
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
33+
"AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
34+
LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
35+
A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
36+
HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
37+
SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
38+
LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
39+
DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
40+
THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
41+
(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
42+
OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

‎examples/javascript-vite/README.md‎

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
# Nutrient Web SDK - JavaScript + Vite example
2+
3+
This example demonstrates how to integrate Nutrient Web SDK into a JavaScript application using Vite as the build tool.
4+
5+
## Prerequisites
6+
7+
- Node.js 16 or higher
8+
- npm or yarn package manager
9+
10+
## Getting started
11+
12+
1. Clone the repository:
13+
```bash
14+
git clone https://github.com/PSPDFKit/nutrient-web-examples.git
15+
cd nutrient-web-examples/examples/javascript-vite
16+
```
17+
18+
2. Install dependencies:
19+
```bash
20+
npm install
21+
```
22+
23+
## Usage
24+
25+
### CDN installation (recommended)
26+
27+
The example uses CDN by default, loading Nutrient Web SDK from Nutrient’s Content Delivery Network (CDN).
28+
29+
#### Development mode:
30+
```bash
31+
npm run dev
32+
```
33+
34+
#### Production build:
35+
```bash
36+
npm run build
37+
npm run preview
38+
```
39+
40+
### Local npm package installation
41+
42+
To use the locally installed npm package instead of CDN:
43+
44+
#### Development mode:
45+
```bash
46+
npm run dev:npm
47+
```
48+
49+
#### Production build:
50+
```bash
51+
npm run build:npm
52+
npm run preview:npm
53+
```
54+
55+
### Differences between approaches
56+
57+
- **CDN** (default): Loads SDK from external CDN, smaller bundle size, requires internet connection
58+
- **npm package**: Bundles Nutrient SDK with your application, larger bundle size, works offline
59+
60+
For more information, refer to our [JavaScript getting started](https://www.nutrient.io/sdk/web/getting-started/other-frameworks/javascript/) guide.
61+
62+
## License
63+
64+
This software is licensed under a [modified BSD license](LICENSE).
65+
66+
## Support, issues and license questions
67+
68+
Nutrient offers support for customers with an active SDK license. Submit your query at — https://www.nutrient.io/support/request/
69+
70+
Are you [evaluating our SDK](https://www.nutrient.io/sdk/try)? That’s great, we’re happy to help out! To make sure this is fast, please use a work email and have someone from your company fill out our sales form: https://www.nutrient.io/contact-sales
71+
72+
## Contributing
73+
74+
Please ensure [you’ve signed our CLA](https://www.nutrient.io/guides/web/miscellaneous/contributing/) so we can accept your contributions.

‎examples/javascript-vite/index.html‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>Nutrient Web SDK - JavaScript + Vite Example</title>
7+
<link rel="stylesheet" href="/src/style.css" />
8+
<!-- Load Nutrient Web SDK from CDN (comment out or remove when using npm package) -->
9+
<script src="https://cdn.cloud.pspdfkit.com/[email protected]/nutrient-viewer.js"></script>
10+
</head>
11+
<body>
12+
<header>
13+
<div class="info-text">
14+
<span>📄 Sample PDF loaded by default</span> &nbsp;•&nbsp;
15+
<button id="openAnotherDoc" class="btn">Open another document</button>
16+
</div>
17+
</header>
18+
<div id="app" class="App"></div>
19+
<script type="module" src="/src/main.js"></script>
20+
</body>
21+
</html>
22+

0 commit comments

Comments
 (0)