first commit
Some checks failed
Types tests / Test (lts/*) (push) Has been cancelled
Lint / Lint (lts/*) (push) Has been cancelled
CodeQL / Analyze (javascript) (push) Has been cancelled
CI / Test (20) (push) Has been cancelled
CI / Test (22) (push) Has been cancelled
CI / Test (24) (push) Has been cancelled

This commit is contained in:
2025-10-03 22:20:19 +08:00
commit 44db9807a1
2172 changed files with 526822 additions and 0 deletions

1
examples/webpack/.gitignore vendored Normal file
View File

@@ -0,0 +1 @@
node_modules/

View File

@@ -0,0 +1,33 @@
## Overview
Example to demonstrate PDF.js library usage with Webpack.
## Getting started
Install the example dependencies and build the project:
$ gulp dist-install
$ cd examples/webpack
$ npm install
$ ./node_modules/webpack/bin/webpack.js
You can observe the build results by running `gulp server` and navigating to
http://localhost:8888/examples/webpack/index.html.
Refer to the `main.js` and `webpack.config.js` files for the source code.
Note that PDF.js packaging requires packaging of the main application and
the worker code, and the `workerSrc` path shall be set to the latter file.
### Minification
If you are configuring Webpack to output a minified build, please note that you
*must* configure the minifier to keep original class/function names intact;
otherwise the build is not guaranteed to work correctly.
## Worker loading
If you are getting the `Setting up fake worker` warning, make sure you are
importing `pdfjs-dist/webpack.mjs` which is the zero-configuration method for
Webpack users. Installing `worker-loader` is no longer necessary.
import * as pdfjsLib from 'pdfjs-dist/webpack.mjs';

View File

@@ -0,0 +1,11 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>webpack example</title>
<script src="../../build/webpack/main.bundle.js"></script>
</head>
<body>
<canvas id="theCanvas"></canvas>
</body>
</html>

29
examples/webpack/main.mjs Normal file
View File

@@ -0,0 +1,29 @@
// Any copyright is dedicated to the Public Domain.
// http://creativecommons.org/licenses/publicdomain/
// Hello world example for webpack.
import * as pdfjsLib from "pdfjs-dist";
const pdfPath = "../learning/helloworld.pdf";
// Setting worker path to worker bundle.
pdfjsLib.GlobalWorkerOptions.workerSrc =
"../../build/webpack/pdf.worker.bundle.js";
// Loading a document.
const loadingTask = pdfjsLib.getDocument(pdfPath);
const pdfDocument = await loadingTask.promise;
// Request a first page
const pdfPage = await pdfDocument.getPage(1);
// Display page on the existing canvas with 100% scale.
const viewport = pdfPage.getViewport({ scale: 1.0 });
const canvas = document.getElementById("theCanvas");
canvas.width = viewport.width;
canvas.height = viewport.height;
const ctx = canvas.getContext("2d");
const renderTask = pdfPage.render({
canvasContext: ctx,
viewport,
});
await renderTask.promise;

View File

@@ -0,0 +1,12 @@
{
"name": "webpack-pdf.js-example",
"version": "0.2.0",
"scripts": {
"build": "webpack"
},
"devDependencies": {
"webpack": "^5.89.0",
"webpack-cli": "^5.1.4",
"pdfjs-dist": "../../node_modules/pdfjs-dist"
}
}

View File

@@ -0,0 +1,18 @@
/* eslint-disable import/no-commonjs */
const webpack = require("webpack"); // eslint-disable-line no-unused-vars
const path = require("path");
module.exports = {
context: __dirname,
entry: {
main: "./main.mjs",
"pdf.worker": "pdfjs-dist/build/pdf.worker.mjs",
},
mode: "none",
output: {
path: path.join(__dirname, "../../build/webpack"),
publicPath: "../../build/webpack/",
filename: "[name].bundle.js",
},
};