Skip to content

Commit bd51775

Browse files
committed
fix package size
1 parent 53d90fc commit bd51775

File tree

9 files changed

+63
-40
lines changed

9 files changed

+63
-40
lines changed

App.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@ function App() {
5555
<Text>{'\nPDF type (uri -> base64)'}</Text>
5656
<Switch
5757
value={pdfType}
58-
onValueChange={value => {
58+
onValueChange={(value) => {
5959
setPdfType(value)
6060
if (value) {
6161
setUseGoogleReader(false)
@@ -65,7 +65,7 @@ function App() {
6565
<Text>{'\nGoogle Reader?'}</Text>
6666
<Switch
6767
value={useGoogleReader}
68-
onValueChange={value => {
68+
onValueChange={(value) => {
6969
setUseGoogleReader(value)
7070
if (value) {
7171
setPdfType(false)

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
"author": "Xavier Carpentier <[email protected]> (https://xaviercarpentier.com/)",
88
"license": "MIT",
99
"scripts": {
10-
"start": "yarn config:dev && expo start",
10+
"start": "yarn config:dev && expo start -c",
1111
"tsc": "node_modules/.bin/tsc --noEmit",
1212
"bundle": "./scripts/gen_bundle_string.js",
1313
"build": "yarn bundle && rm -rf lib/ && node_modules/.bin/tsc",

react-pdf/Reader.tsx

Lines changed: 17 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import * as React from 'react'
22
import { render } from 'react-dom'
3-
import { Page, Document, pdfjs } from 'react-pdf'
3+
import Document from 'react-pdf/dist/Document'
4+
import Page from 'react-pdf/dist/Page'
45
import raf, { cancel } from 'raf'
56
import Down from './components/down'
67
import Plus from './components/Plus'
@@ -9,12 +10,12 @@ import Up from './components/up'
910
import './Reader.less'
1011

1112
const ReactContainer = document.querySelector('#react-container')
13+
// const PDFJS = pdfjs as any
1214

13-
const PDFJS = pdfjs as any
14-
15-
PDFJS.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${PDFJS.version}/pdf.worker.js`
15+
// PDFJS.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${PDFJS.version}/pdf.worker.js`
16+
const version = '2.1.266'
1617
const options = {
17-
cMapUrl: `//cdn.jsdelivr.net/npm/pdfjs-dist@${PDFJS.version}/cmaps/`,
18+
cMapUrl: `//cdn.jsdelivr.net/npm/pdfjs-dist@${version}/cmaps/`,
1819
cMapPacked: true,
1920
}
2021

@@ -62,7 +63,10 @@ class Reader extends React.Component<Props, State> {
6263
this.setState({ numPages })
6364
}
6465

65-
onError = (error: Error) => this.setState({ error })
66+
onError = (error: Error) => {
67+
console.error(error)
68+
this.setState({ error })
69+
}
6670

6771
zoomOut = (event: any) => {
6872
event.preventDefault()
@@ -81,7 +85,7 @@ class Reader extends React.Component<Props, State> {
8185
zIn = () => {
8286
if (this.state.scale <= this.MAX_SCALE - 0.25) {
8387
this.__zoomEvent = true
84-
this.setState(previousState => ({
88+
this.setState((previousState) => ({
8589
scale: previousState.scale + 0.25,
8690
}))
8791
}
@@ -91,7 +95,7 @@ class Reader extends React.Component<Props, State> {
9195
if (this.state.scale >= 0.75) {
9296
// min scale out is 0.5 and defaults @ 0.75
9397
this.__zoomEvent = true
94-
this.setState(previousState => ({
98+
this.setState((previousState) => ({
9599
scale: previousState.scale - 0.25,
96100
}))
97101
}
@@ -135,6 +139,7 @@ class Reader extends React.Component<Props, State> {
135139
onLoadError={this.onError}
136140
onRenderError={this.onError}
137141
onGetTextError={this.onError}
142+
onGetAnnotationsError={this.onError}
138143
width={(document.body.clientWidth * 90) / 100}
139144
onRenderSuccess={() => {
140145
this.__zoomEvent = false
@@ -145,8 +150,10 @@ class Reader extends React.Component<Props, State> {
145150

146151
renderPages = () => {
147152
const pagesRange = Array.from(Array(this.state.numPages).keys())
148-
return pagesRange.map(n => (
149-
<div style={{ marginBottom: 10 }}>{this.renderPage(n + 1)}</div>
153+
return pagesRange.map((n) => (
154+
<div key={`page-${n.toString()}`} style={{ marginBottom: 10 }}>
155+
{this.renderPage(n + 1)}
156+
</div>
150157
))
151158
}
152159

react-pdf/index.html

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,12 @@
33
<head>
44
<meta charset="utf-8" />
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<script src="//cdn.jsdelivr.net/npm/[email protected]/build/pdf.min.js"></script>
7+
<script src="//cdn.jsdelivr.net/npm/[email protected]/web/pdf_viewer.min.js"></script>
8+
<script>
9+
pdfjsLib.GlobalWorkerOptions.workerSrc =
10+
'//cdn.jsdelivr.net/npm/[email protected]/build/pdf.worker.min.js'
11+
</script>
612
<script type="application/javascript">
713
window.CUSTOM_STYLE = JSON.parse(
814
'{"readerContainerNavigate":{"backgroundColor": "red"}}',

react-pdf/package.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"version": "1.0.0",
44
"private": true,
55
"scripts": {
6-
"build": "rm -rf dist/ && ./node_modules/.bin/webpack-cli --mode=production --optimize-minimize",
6+
"build": "rm -rf dist/ && NODE_ENV=production ./node_modules/.bin/webpack-cli --mode=production --optimize-minimize",
77
"dev": "./node_modules/.bin/webpack-dev-server --mode=development"
88
},
99
"dependencies": {
@@ -40,8 +40,8 @@
4040
"style-loader": "1.1.2",
4141
"ts-loader": "6.2.1",
4242
"url-loader": "3.0.0",
43-
"webpack": "4.41.5",
44-
"webpack-cli": "3.3.10",
45-
"webpack-dev-server": "3.10.1"
43+
"webpack": "4.43.0",
44+
"webpack-cli": "3.3.11",
45+
"webpack-dev-server": "3.11.0"
4646
}
4747
}

react-pdf/webpack.config.js

Lines changed: 8 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -34,14 +34,12 @@ module.exports = {
3434
},
3535
],
3636
},
37-
plugins: [
38-
new webpack.optimize.LimitChunkCountPlugin({ maxChunks: 1 }),
39-
new CopyWebpackPlugin([
40-
{ from: './index.html' },
41-
{
42-
from: 'node_modules/pdfjs-dist/cmaps/',
43-
to: 'cmaps/',
44-
},
45-
]),
46-
],
37+
externals: {
38+
'pdfjs-dist': 'pdfjsLib',
39+
'pdfjs-dist/lib/web/pdf_link_service': 'pdfjsViewer',
40+
},
41+
plugins: [new CopyWebpackPlugin([{ from: './index.html' }])],
42+
optimization: {
43+
minimize: true,
44+
},
4745
}

scripts/gen_bundle_string.js

Lines changed: 4 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,20 +3,17 @@
33
const fs = require('fs')
44
const path = require('path')
55
const crypto = require('crypto')
6+
67
const encoding = { encoding: 'utf8' }
78
const originPath = path.join(__dirname, '../react-pdf/dist/bundle.js')
89
const destinationPath = path.join(__dirname, '../src/bundleContainer.ts')
910

10-
const read = path => fs.readFileSync(path, encoding)
11-
const toBase64 = str => Buffer.from(str).toString('base64')
11+
const read = (path) => fs.readFileSync(path, encoding)
12+
const toBase64 = (str) => Buffer.from(str).toString('base64')
1213

1314
const bundleString = read(originPath)
14-
const md5 = crypto
15-
.createHash('md5')
16-
.update(bundleString)
17-
.digest('hex')
15+
const md5 = crypto.createHash('md5').update(bundleString).digest('hex')
1816

19-
// TODO: calculate md5 (ie. update new version)
2017
const bundleContainerFileContent = `
2118
import { Base64 } from 'js-base64';
2219
const bundle = '${toBase64(bundleString)}';

src/bundleContainer.ts

Lines changed: 2 additions & 2 deletions
Large diffs are not rendered by default.

src/index.tsx

Lines changed: 19 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -76,6 +76,12 @@ function viewerHtml(
7676
<title>PDF reader</title>
7777
<meta charset="utf-8" />
7878
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
79+
<script src="https://cdn.jsdelivr.net/npm/[email protected]/build/pdf.min.js"></script>
80+
<script src="https://cdn.jsdelivr.net/npm/[email protected]/web/pdf_viewer.min.js"></script>
81+
<script>
82+
pdfjsLib.GlobalWorkerOptions.workerSrc =
83+
'https://cdn.jsdelivr.net/npm/[email protected]/build/pdf.worker.min.js'
84+
</script>
7985
<script type="application/javascript">
8086
try {
8187
window.CUSTOM_STYLE = JSON.parse('${JSON.stringify(
@@ -181,7 +187,7 @@ async function urlToBlob(source: Source): Promise<Blob | undefined> {
181187
xhr.open('GET', source.uri!)
182188

183189
if (source.headers && Object.keys(source.headers).length > 0) {
184-
Object.keys(source.headers).forEach(key => {
190+
Object.keys(source.headers).forEach((key) => {
185191
xhr.setRequestHeader(key, source.headers![key])
186192
})
187193
}
@@ -388,9 +394,15 @@ class PdfReader extends React.Component<Props, State> {
388394
webviewProps,
389395
} = this.props
390396

391-
const originWhitelist = ['http://*', 'https://*', 'file://*', 'data:*']
397+
const originWhitelist = [
398+
'http://*',
399+
'https://*',
400+
'file://*',
401+
'data:*',
402+
'content:*',
403+
]
392404
const style = [styles.webview, webviewStyle]
393-
405+
// html: `<script>alert(navigator.serviceWorker)</script>`,
394406
const isAndroid = Platform.OS === 'android'
395407
if (ready) {
396408
const source: WebViewSource | undefined = this.getWebviewSource()
@@ -399,7 +411,7 @@ class PdfReader extends React.Component<Props, State> {
399411
<WebView
400412
{...{
401413
originWhitelist,
402-
onLoad: event => {
414+
onLoad: (event) => {
403415
this.setState({ renderedOnce: true })
404416
if (onLoad) {
405417
onLoad(event)
@@ -412,6 +424,9 @@ class PdfReader extends React.Component<Props, State> {
412424
source: renderedOnce || !isAndroid ? source : undefined,
413425
}}
414426
allowFileAccess={isAndroid}
427+
allowFileAccessFromFileURLs={isAndroid}
428+
allowUniversalAccessFromFileURLs={isAndroid}
429+
androidHardwareAccelerationDisabled
415430
scalesPageToFit={Platform.select({ android: false })}
416431
mixedContentMode={isAndroid ? 'always' : undefined}
417432
sharedCookiesEnabled={false}

0 commit comments

Comments
 (0)