Yury Delendik
9 years ago
15 changed files with 170 additions and 19 deletions
@ -0,0 +1,18 @@ |
|||||||
|
## Overview |
||||||
|
|
||||||
|
Example to demonstrate PDF.js library usage with webpack. |
||||||
|
|
||||||
|
## Getting started |
||||||
|
|
||||||
|
Build project and install the example dependencies: |
||||||
|
|
||||||
|
$ node make dist |
||||||
|
$ cd examples/webpack |
||||||
|
$ npm install |
||||||
|
|
||||||
|
To build webpack bundles, run `node_modules/.bin/webpack`. If you are running |
||||||
|
a web server, you can observe the build results at |
||||||
|
http://localhost:8888/examples/webpack/index.html |
||||||
|
|
||||||
|
See main.js and webpack.config.js files. Please notice that PDF.js packaging |
||||||
|
requires 'entry' loader. |
||||||
@ -0,0 +1,11 @@ |
|||||||
|
<!DOCTYPE html> |
||||||
|
<html lang="en"> |
||||||
|
<head> |
||||||
|
<meta charset="UTF-8"> |
||||||
|
<title>webpack example</title> |
||||||
|
<script src="../../build/webpack/bundle.js"></script> |
||||||
|
</head> |
||||||
|
<body> |
||||||
|
<canvas id="theCanvas"></canvas> |
||||||
|
</body> |
||||||
|
</html> |
||||||
@ -0,0 +1,32 @@ |
|||||||
|
// Any copyright is dedicated to the Public Domain.
|
||||||
|
// http://creativecommons.org/licenses/publicdomain/
|
||||||
|
|
||||||
|
// Hello world example for webpack.
|
||||||
|
|
||||||
|
require('pdfjs-dist'); |
||||||
|
|
||||||
|
var pdfPath = '../helloworld/helloworld.pdf'; |
||||||
|
|
||||||
|
// It is also possible to disable workers via `PDFJS.disableWorker = true`,
|
||||||
|
// however that might degrade the UI performance in web browsers.
|
||||||
|
|
||||||
|
// Loading a document.
|
||||||
|
var loadingTask = PDFJS.getDocument(pdfPath); |
||||||
|
loadingTask.promise.then(function (pdfDocument) { |
||||||
|
// Request a first page
|
||||||
|
return pdfDocument.getPage(1).then(function (pdfPage) { |
||||||
|
// Display page on the existing canvas with 100% scale.
|
||||||
|
var viewport = pdfPage.getViewport(1.0); |
||||||
|
var canvas = document.getElementById('theCanvas'); |
||||||
|
canvas.width = viewport.width; |
||||||
|
canvas.height = viewport.height; |
||||||
|
var ctx = canvas.getContext('2d'); |
||||||
|
var renderTask = pdfPage.render({ |
||||||
|
canvasContext: ctx, |
||||||
|
viewport: viewport |
||||||
|
}); |
||||||
|
return renderTask.promise; |
||||||
|
}); |
||||||
|
}).catch(function (reason) { |
||||||
|
console.error('Error: ' + reason); |
||||||
|
}); |
||||||
@ -0,0 +1,9 @@ |
|||||||
|
{ |
||||||
|
"name": "webpack-pdf.js-example", |
||||||
|
"version": "0.1.0", |
||||||
|
"devDependencies": { |
||||||
|
"webpack": "~1.12.9", |
||||||
|
"entry-loader": "~0.1.0", |
||||||
|
"pdfjs-dist": "../../build/dist" |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,20 @@ |
|||||||
|
var webpack = require('webpack'); |
||||||
|
var path = require('path'); |
||||||
|
|
||||||
|
module.exports = { |
||||||
|
context: __dirname, |
||||||
|
entry: './main.js', |
||||||
|
output: { |
||||||
|
path: path.join(__dirname, '../../build/webpack'), |
||||||
|
publicPath: '../../build/webpack/', |
||||||
|
filename: 'bundle.js' |
||||||
|
}, |
||||||
|
plugins: [ |
||||||
|
new webpack.optimize.UglifyJsPlugin({ |
||||||
|
compressor: { |
||||||
|
screw_ie8: true, |
||||||
|
warnings: false |
||||||
|
} |
||||||
|
}) |
||||||
|
] |
||||||
|
}; |
||||||
@ -0,0 +1,40 @@ |
|||||||
|
/* Copyright 2015 Mozilla Foundation |
||||||
|
* |
||||||
|
* Licensed under the Apache License, Version 2.0 (the "License"); |
||||||
|
* you may not use this file except in compliance with the License. |
||||||
|
* You may obtain a copy of the License at |
||||||
|
* |
||||||
|
* http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
* |
||||||
|
* Unless required by applicable law or agreed to in writing, software |
||||||
|
* distributed under the License is distributed on an "AS IS" BASIS, |
||||||
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||||
|
* See the License for the specific language governing permissions and |
||||||
|
* limitations under the License. |
||||||
|
*/ |
||||||
|
/* globals PDFJS, require, module */ |
||||||
|
|
||||||
|
// included from api.js for GENERIC build
|
||||||
|
|
||||||
|
'use strict'; |
||||||
|
|
||||||
|
var useRequireEnsure = false; |
||||||
|
if (typeof module !== 'undefined' && module.require) { |
||||||
|
// node.js - disable worker and set require.ensure.
|
||||||
|
PDFJS.disableWorker = true; |
||||||
|
if (typeof require.ensure === 'undefined') { |
||||||
|
require.ensure = require('node-ensure'); |
||||||
|
} |
||||||
|
useRequireEnsure = true; |
||||||
|
} |
||||||
|
if (typeof __webpack_require__ !== 'undefined') { |
||||||
|
// Webpack - get/bundle pdf.worker.js as additional file.
|
||||||
|
PDFJS.workerSrc = require('entry?name=[hash]-worker.js!./pdf.worker.js'); |
||||||
|
useRequireEnsure = true; |
||||||
|
} |
||||||
|
var fakeWorkerFilesLoader = useRequireEnsure && function (callback) { |
||||||
|
require.ensure([], function () { |
||||||
|
require('./pdf.worker.js'); |
||||||
|
callback(); |
||||||
|
}); |
||||||
|
}; |
||||||
Loading…
Reference in new issue