He intentado durante algunas horas reemplazar un pdf.js basado en enlaces con una instalación npm de pdfjs-dist , ya que noté que mis enlaces no estaban destinados a ser usados como cdns y podrían volverse inestables como se describe aquí .
No pude encontrar mucha documentación sobre cómo hacer que eso funcione aparte de algunos ejemplos, y cuando se trata de Webpack, en su mayoría son con React, mientras que simplemente estoy usando ES6 en un marco Django (compilación estática en el directorio Django deseado, sin usar el complemento del paquete web).
Después de intercambiar varios mensajes con uno de los chicos que trabajan en pdf.js, parecía que mis errores de compilación probablemente se debían a cómo Webpack maneja internamente la biblioteca. Esto es lo que estoy viendo:
WARNING in ./node_modules/worker-loader/dist/index.js Module not found: Error: Can't resolve 'webpack/lib/web/FetchCompileAsyncWasmPlugin' in '/home/giampaolo/dev/KJ_import/KJ-JS/node_modules/worker-loader/dist' @ ./node_modules/worker-loader/dist/index.js @ ./node_modules/worker-loader/dist/cjs.js @ ./node_modules/pdfjs-dist/webpack.js @ ./src/js/views/pdfViews.js @ ./src/js/index.js WARNING in ./node_modules/worker-loader/dist/index.js Module not found: Error: Can't resolve 'webpack/lib/web/FetchCompileWasmPlugin' in '/home/giampaolo/dev/KJ_import/KJ-JS/node_modules/worker-loader/dist' @ ./node_modules/worker-loader/dist/index.js @ ./node_modules/worker-loader/dist/cjs.js @ ./node_modules/pdfjs-dist/webpack.js @ ./src/js/views/pdfViews.js @ ./src/js/index.js ERROR in (webpack)/lib/node/NodeTargetPlugin.js Module not found: Error: Can't resolve 'module' in '/home/giampaolo/dev/KJ_import/KJ-JS/node_modules/webpack/lib/node' @ (webpack)/lib/node/NodeTargetPlugin.js 11:1-18 @ ./node_modules/worker-loader/dist/index.js @ ./node_modules/worker-loader/dist/cjs.js @ ./node_modules/pdfjs-dist/webpack.js @ ./src/js/views/pdfViews.js @ ./src/js/index.js Child HtmlWebpackCompiler: 1 asset Entrypoint HtmlWebpackPlugin_0 = __child-HtmlWebpackPlugin_0 [./node_modules/html-webpack-plugin/lib/loader.js!./src/src-select.html] 4.57 KiB {HtmlWebpackPlugin_0} [built] Child worker-loader node_modules/pdfjs-dist/build/pdf.worker.js: Asset Size Chunks Chunk Names index.worker.js 1.33 MiB pdf.worker [emitted] pdf.worker Entrypoint pdf.worker = index.worker.js [./node_modules/pdfjs-dist/build/pdf.worker.js] 1.25 MiB {pdf.worker} [built] [./node_modules/process/browser.js] 5.29 KiB {pdf.worker} [built] ℹ ｢wdm｣: Failed to compile. Teóricamente, el pdfjs-dist debería venir con un archivo de configuración cero, sin necesidad de configurar un trabajador para él, por lo que un código como el siguiente debería funcionar:
import pdfjsLib from 'pdfjs-dist/webpack' //////////////////////////////////////////// //// instantiate pdf export const pdfView = () => { // pdfjsLib.GlobalWorkerOptions.workerSrc = 'index.worker.js'; // var defined through a Django template tag const loadingTask = pdfjsLib.getDocument(pdfData.myPdfDoc) pdfData.myPdf = loadingTask.promise.then(pdf => { pdfData.pdfTotalPageN = pdf.numPages; return pdf; }) }pero no se compila, y realmente agradecería algunos consejos. Gracias por adelantado
Si está de acuerdo con el uso de un cdn, entonces use este
import pdfJS from 'pdfjs-dist/build/pdf.js'; pdfJS.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.4.456/pdf.worker.js';Asegúrese de importar versiones minimizadas en producción
import pdfJS from 'pdfjs-dist/build/pdf.min.js'; pdfJS.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.4.456/pdf.worker.min.js';O simplemente puede usar versiones minificadas todo el tiempo
Este problema parece surgir debido a la opción esModule introducida en worker-loader@3.0.0 .
La solución para esto se fusionó en (pre-release) pdjs-dist@2.6.347
Puede solucionar esto actualizando pdfjs-dist a v2.6.347 O degradando worker-loader a v2.0.0
si webpack falla debido a un encadenamiento opcional, considere apuntar a la versión heredada que omite la sintaxis moderna.
import * as pdfjs from 'pdfjs-dist/legacy/build/pdf.js'
en lugar de
import * as pdfjs from 'pdfjs-dist'
Ir
node_modules/pdfsj-dist/paquete.json
En
"peerDependencies": { "worker-loader": "^3.0.8" -> Version },Instalar versión
npm i trabajador-cargador@3.0.8
Trabajó con:
var pdflib = require('pdfjs-dist/build/pdf.js'); import pdfjsWorker from 'pdfjs-dist/build/pdf.worker.js'; pdflib.GlobalWorkerOptions.workerPort = new pdfjsWorker();