Skip to content

Commit f3a78ae

Browse files
committed
Add Vue example for PSPDFKit integration
- Created a new Vue.js example project demonstrating the integration of PSPDFKit for Web. - Added essential files including index.html, package.json, and README.md with setup instructions. - Implemented components for PDF viewing and file upload functionality. - Included scripts for verifying installation and copying necessary PSPDFKit files. - Configured Vite for development and build processes. - Added .gitignore to exclude node_modules and PSPDFKit library files. - Included sample PDF and favicon assets for demonstration.
1 parent f5c2f61 commit f3a78ae

File tree

14 files changed

+2930
-0
lines changed

14 files changed

+2930
-0
lines changed

examples/vue/.gitignore

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
/node_modules
2+
public/js/pspdfkit.js
3+
public/js/pspdfkit-lib/*

examples/vue/LICENSE

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
The PSPDFKit 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 PSPDFKit License to run these examples
8+
in non-demo mode. Please refer to [email protected] for details.
9+
10+
Copyright © 2018-present PSPDFKit GmbH.
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 PSPDFKit Samples must include attribution to
26+
PSPDFKit, either in documentation or other appropriate media.
27+
28+
- Neither the name of the PSPDFKit, 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/vue/README.md

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
# Nutrient Web SDK Example – Vue
2+
3+
This example shows how to integrate [PSPDFKit for Web](https://www.nutrient.io/web/) into a Vue.js app.
4+
5+
## Prerequisites
6+
7+
- [Node.js](http://nodejs.org/)
8+
- PSPDFKit for Web (get your free trial [here](https://www.nutrient.io/try/))
9+
10+
## Support, Issues and License Questions
11+
12+
PSPDFKit offers support for customers with an active SDK license via https://www.nutrient.io/support/request/
13+
14+
Are you [evaluating our SDK](https://www.nutrient.io/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/sales/
15+
16+
## Getting Started
17+
18+
Clone the repo:
19+
20+
```bash
21+
git clone https://github.com/PSPDFKit/pspdfkit-web-example-vue.git
22+
cd pspdfkit-web-example-vue
23+
```
24+
25+
Install the project dependencies with `npm`:
26+
27+
```bash
28+
npm install
29+
```
30+
31+
## Vue Component
32+
33+
The Vue component which implements the PSPDFKit for Web integration is included at `src/App.vue` with the rest of the example.
34+
35+
In order to make the PSPDFKit for Web's library available for building, we have to copy the `pspdfkit-lib/` directory from `node_modules/pspdfkit/dist/` into the `public/js/` directory. This is done in the `package.json` script `verify-installation` which is executed by `serve`.
36+
37+
## Running the Example
38+
39+
We are ready to launch the app! 🎉
40+
41+
```bash
42+
npm run serve
43+
```
44+
45+
You can now open http://localhost:4173 in your browser and enjoy!
46+
47+
## License
48+
49+
This software is licensed under a [modified BSD license](LICENSE).
50+
51+
## Contributing
52+
53+
Please ensure
54+
[you have signed our CLA](https://www.nutrient.io/guides/web/current/miscellaneous/contributing/) so that we can
55+
accept your contributions.

examples/vue/index.html

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<!DOCTYPE html>
2+
<html lang="">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
6+
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
7+
<link rel="icon" href="/favicon.ico" />
8+
<title>Nutrient Web SDK Vue example</title>
9+
</head>
10+
<body>
11+
<noscript>
12+
<strong
13+
>We're sorry but Nutrient Web SDK doesn't work properly without
14+
JavaScript enabled. Please enable it to continue.</strong
15+
>
16+
</noscript>
17+
<div id="app"></div>
18+
<script src="/js/pspdfkit.js"></script>
19+
<script type="module" src="/src/main.js"></script>
20+
</body>
21+
</html>

0 commit comments

Comments
 (0)