Pdf.js: Systemjs 지원

에 만든 2015년 12월 22일 · 34코멘트 · 출처: mozilla/pdf.js

systemjs에 대한 지원을 추가하십시오.

2-feature

출처

Vanuan

모든 34 댓글

예제가 제공되지 않았으므로 더 많은 정보를 요청합니다. 그리고 Browserify는 현재 pdfjs-dist와 함께 작동한다고 생각합니다 (일부 모듈 예외 포함).

yurydelendik 에 2015년 12월 22일

다음은 systemjs를 사용하는 가장 일반적인 예입니다.

npm install jspm
jspm init # use defaults
jspm install pdfjs-dist

index.html

<!DOCTYPE html>
<html lang="en-us">

<head>
<meta charset="utf-8">
<title>Title</title>
</head>

<body>
    <script src="jspm_packages/system.js"></script>
    <script src="config.js"></script>
    <script>
      System.import('src/app.js');
    </script>
</body>
</html>

src / app.js

# ES6 syntax
import pdfjs from 'pdfjs-dist';

# expected pdfjs to be a window.PDFJS object

Vanuan 에 2015년 12월 22일

예를 들어 감사합니다

yurydelendik 에 2015년 12월 22일

이전 버전에서는 jspm shim을 사용하여 pdfjs를 사용할 수있었습니다.
https://github.com/jspm/registry/wiki/Configuring-Packages-for-jspm
그러나 node-ensure를 포함시킨 후에는 할 수 없습니다 (node-ensure는 system.js와 호환되지 않는 것 같습니다).

Vanuan 에 2015년 12월 22일

실제로 이것은 Systemjs 로더가 아닌 jspm 패키지 프로그램에 대한 요청입니다.
즉, jspm shim이 필요한 경우 괜찮지 만 node-ensure와 같은 호환되지 않는 변경 사항을 추가하지 마십시오.

Vanuan 에 2015년 12월 22일

바누 안

config.js에서 문제를 해결하려면 다음을 수행하십시오.

    "npm:[email protected]": {
      "process": "github:jspm/[email protected]",
      "node-ensure": "empty",
      "entry?name=[hash]-worker.js": "empty"
    },

(비어있는 것은 내용이없는 empty.js 파일입니다)

비슷한 해킹이 Browserify에 필요합니다.

yurydelendik 에 2015년 12월 22일

이제 문제 : pdf.worker.js가 두 번로드되었습니다. 문제는 webpack의 request.ensure ()에 의해 해결되었습니다. './pdf.worker.js'는 실제로 필요할 때까지로드되지 않아야합니다.

yurydelendik 에 2015년 12월 22일

"PDFJS.disableWorker = true"라고 생각했습니다. 해결해? 그렇지 않나요?

Vanuan 에 2015년 12월 22일

System.import('./pdf.worker') 를 사용하는 경우 하나의 http 요청 만 발행합니다.

또는 System.import('pdfjs-dist/build/pdf.worker')

node-ensure 이 사용 된 특별한 이유가 있습니까? 시스템 로더가 Webpack에서 잘 작동한다고 생각합니다.

Vanuan 에 2015년 12월 22일

"PDFJS.disableWorker = true;" PDF 처리를 다른 스레드로 옮기고 싶기 때문에 옵션이 아닙니다. 도서관 사용자에게 형편없는 솔루션을 제안하고 싶지 않습니까?

yurydelendik 에 2015년 12월 22일

글쎄, 나는 전혀 해결책이없는 것보다 형편없는 해결책을 선호 할 것입니다. 내 사용 사례의 경우 1 초 페이지 고정도 괜찮습니다.
더 나은 해결책을 찾으면 기쁩니다.

Vanuan 에 2015년 12월 22일

node-ensure가 사용 된 특별한 이유가 있습니까?

examples / webpack /이 생성하는 것을주의 깊게 살펴보면 :

pdf.js yury$ ls -la build/webpack/
total 2384
drwxr-xr-x   5 yury  staff     170 Dec 22 15:20 .
drwxr-xr-x  34 yury  staff    1156 Dec 22 10:08 ..
-rw-r--r--   1 yury  staff  546125 Dec 21 16:35 1.bundle.js
-rw-r--r--   1 yury  staff  546463 Dec 21 16:35 9d074593b165291f150e-worker.js
-rw-r--r--   1 yury  staff  122796 Dec 21 16:35 bundle.js

"bundle.js"는로드되는 기본 파일입니다 (즉, 122796 바이트 후에 UI를 가져오고 초기화하므로 페이지 시작 속도가 빨라짐). '9d074593b165291f150e-worker.js'는 로직을 실행하고 느린 기기에서 UI를 잠그지 않는 작업자입니다. "1.bundle.js"부분은 disableWorker가 트리거 된 경우 및 IE9와 같은 레거시 브라우저에 대해서만로드됩니다.

yurydelendik 에 2015년 12월 22일

더 나은 해결책을 찾으면 기쁩니다.

나는 systemjs가 모든 요구 사항을 구문 분석하지 않도록 약간의 가드를 가질 것으로 기대하고 있습니다 ( "./pdf.worker.js"를 "empty"로 바꾸는 것이 저에게 효과가 없었습니다).

@Vanuan systemjs 에 문제를 제출하여 더 나은 점이 있는지 확인할 수 있습니까? 감사.

yurydelendik 에 2015년 12월 22일

systemjs https://github.com/systemjs/systemjs/issues/983의 마지막 문제처럼 들리나요?

yurydelendik 에 2015년 12월 22일

글쎄, 나는 전혀 해결책이없는 것보다 형편없는 해결책을 선호 할 것입니다. 내 사용 사례의 경우 1 초 페이지 고정도 괜찮습니다.

@Vanuan , pdf.combined.js 파일 사용에 변경된 사항이 없습니다 (희망합니다)-이러한 경우에 대해 유지해야하는 것처럼 보입니다. # 6729에서 문제로 설명한대로 사용해야합니다. 귀하의 설명에서 systemjs를 사용하여 PDFJS를로드 할 계획이 분명하지 않았습니다.

yurydelendik 에 2015년 12월 22일

pdf.combined.js 파일 사용시 변경된 사항이 없습니다.

아, 좋아요!

Vanuan 에 2015년 12월 22일

어쨌든 작업자와 함께 사용하는 것과 관련하여 분명히 뭔가 변경되었습니다.
이전에는 작업자에 대한 전체 경로를 사용할 수 있었지만 그 안에 Uncaught ReferenceError: require is not defined 를 넣을 수있었습니다.

PDFJS.workerSrc = 'jspm_packages/npm/[email protected]/build/pdf.worker.js';

이제 파일을로드하는 중에 멈춘 것 같습니다. 모듈로드 콜백이 완료되지 않는 것처럼.
요청 된 마지막 모듈은 process 입니다.

아마도 Systemjs는 다음 구성을 처리 할 수 없습니다.

(function(process) {
  if (typeof PDFJS === 'undefined') {
    (typeof window !== 'undefined' ? window : this).PDFJS = {};
  }
})(require('process'));

Vanuan 에 2015년 12월 23일

👍1

어쨌든 작업자와 함께 사용하는 것과 관련하여 분명히 뭔가 변경되었습니다.
이전에는 작업자에 대한 전체 경로를 사용할 수 있었지만

pdf.combined.js는 pdf.worker.js를 완전히 포함 / 포함하며 workerSrc를 지정할 필요가 없습니다.

yurydelendik 에 2015년 12월 23일

pdf.combined.js https://github.com/mozilla/pdfjs-dist/commit/a7cd5f77b00bac19c0f6ee4c2cfd5bbf0fe45d8f#diff -eccf5b94e31b0939738de07167e02af6의 변경 사항

yurydelendik 에 2015년 12월 23일

네, jspm과 함께 작업자를 사용하는 옵션을 평가하고 있습니다.

Vanuan 에 2015년 12월 23일

이제 문제 : pdf.worker.js가 두 번로드되었습니다. 문제는 webpack의 request.ensure ()에 의해 해결되었습니다.

이제 주 스레드에서로드되고 importScripts ()를 사용하지 않습니까?

Vanuan 에 2015년 12월 23일

내 src / app.js는 다음과 같습니다.

import pdfjs from 'pdfjs-dist';

console.log(PDFJS);

따라서 아직 getDocument를 사용하지 않지만 네트워크 모니터에는 pdf.worker.js에 대한 두 개의 항목이 표시됩니다.

yurydelendik 에 2015년 12월 23일

이상 해요. 항목이 하나만 표시됩니다.

Vanuan 에 2015년 12월 23일

이상 해요. 항목이 하나만 표시됩니다.

AFAIK가 아닙니다. :)

yurydelendik 에 2015년 12월 23일

Firefox와 Chrome에서도 동일합니다.
screen shot 2015-12-22 at 5 34 42 pm

yurydelendik 에 2015년 12월 23일

아. 그래서 Systemjs는 모든 require 멍청하게 파싱하고로드하려고합니다 ...

Vanuan 에 2015년 12월 23일

조건부 요구는 매우 일반적인 사용 사례가 아닙니다.

Vanuan 에 2015년 12월 23일

이것이 노드 보장로드를 시도하는 이유입니다.

Vanuan 에 2015년 12월 23일

안녕하세요.
어떻게 도움 웹팩이 필요합니까? Webpack은 여전히 importScripts를 사용하여 작업자를로드합니다.

Vanuan 에 2015년 12월 23일

조건부 요구는 매우 일반적인 사용 사례가 아닙니다.

동의하지 않습니다. https://github.com/systemjs/systemjs/issues/983 및 https://github.com/webpack/docs/wiki/code-splitting 이 일반적인 사용 사례입니다.

Webpack은 여전히 importScripts를 사용하여 작업자를로드합니다.

~~그렇습니다.~~ new Worker(..) . 그러나 작업자가 비활성화 된 경우 pdf.worker.js를 모듈로로드하는 옵션도 있습니다.

yurydelendik 에 2015년 12월 23일

이 문제는 # 6775에 의해 해결 될 것입니다. systemjs는 모듈 유형을 자동 감지합니다. 이제 commonjs이고 UMD를 사용하면 AMD가되므로 require ()를 구문 분석하지 않습니다.

https://github.com/yurydelendik/pdf.js/tree/pdfjsumd 에서 PS wip

yurydelendik 에 2015년 12월 28일

와우, 잘 됐네요. 합병하고 풀어 주 자마자 노력하겠습니다.

Vanuan 에 2015년 12월 28일

# 6825에 의해 수정 된대로 닫힙니다. 남아있는 문제가 있으면 새 문제를여십시오.

timvandermeij 에 2016년 01월 08일

jspm을 사용할 때 모듈 형식을 재정의하는 것이 좋습니다. jspm install npm:pdfjs-dist -o "{format: 'amd'}"

yurydelendik 에 2016년 04월 04일

이 페이지가 도움이 되었나요?

0 / 5 - 0 등급

Pdf.js: Systemjs 지원

모든 34 댓글

관련 문제