<p>pdf.js ne fonctionne pas avec requirejs</p>

qu'est-ce que 'pdf' ? pouvez-vous fournir un exemple complet?

Bien sûr, je vais configurer un référentiel Github pour en faire une démonstration plus complète.

Voici le repo : https://github.com/MartinSnyder/pdfjs-with-requirejs

« pdf » est la référence du module qui nécessite de tenter de revenir à cette fonction. Dans ce scénario, Requirejs charge dynamiquement pdf.js et tente de renvoyer la "référence de module" à la fonction de rappel, mais la référence de module n'est pas définie. Vous pouvez voir la charge dynamique se produire via le débogueur réseau du navigateur.

Ce ne serait pas si grave normalement, sauf que quelque chose dans pdf.js détecte qu'un chargeur de module est présent et ne définit donc PAS l'objet PDFJS global. Comme aucun n'est présent, vous ne pouvez pas utiliser la bibliothèque lorsque requirejs est sur la page.

Notez que cela se produit même si vous n'utilisez pas require pour charger l'objet. J'ai mis une référence de script commentée à pdf.js sur la page. Si cela est placé avant require, alors le global sera défini correctement. Si cela est placé après require, alors le global ne sera PAS défini.

Il y a deux problèmes avec le code :

1. le module n'est pas référencé par son nom, utilisez 'pdfjs-dist/build/pdf' (et si vous déplacez pdfjs-dist dans un endroit différent, utilisez require.config pour changer l'emplacement)
2. vous utilisez document.write, qui efface le document

Essayez quelque chose comme :

        require.config({paths: {'pdfjs-dist': './node_modules/pdfjs-dist'}});
        require(['pdfjs-dist/build/pdf'], function(pdf) {
            console.log('PDFJS Module: ' + pdf + '<br>');
            console.log('PDFJS Global: ' + window.PDFJS);
        });

Fermeture comme répondu.

Notez que cela fonctionne correctement avec la version 1.0.1040

Travailler avec cette version est un effet secondaire du chargement d'un script par requirejs en tant que balise de script standard - n'indique pas qu'il est compatible avec require.js

définir l'instance PDFJS globale

Global PDFJS sera supprimé dans les futures versions, donc si vous utilisez requirejs, vous pouvez utiliser le même objet via pdf.PDFJS /

Concernant le point 1 :
Je n'ai pas utilisé node pour inclure pdf.js dans cet exemple. J'ai téléchargé la distribution officielle et copié pdf.js dans le répertoire racine de l'échantillon. Pour cette raison, le référencer en tant que « pdf » est correct. Vous pouvez le vérifier en regardant l'exemple dans le débogueur réseau et vous verrez que le fichier est correctement téléchargé par require.

Concernant le point 2 :
Cela a été fait pour simplifier l'exemple. Indépendamment de ce que fait l'exemple, les références ne sont pas définies et la bibliothèque ne peut pas être utilisée. Plus précisément, le passage à console.log affiche également les références comme non définies.

En ce qui concerne la suppression de Global PDFJS dans les futures versions :
Je suis d'accord avec ça, mais comment est-on censé référencer la bibliothèque via pdf.PDFJS lorsque pdf n'est pas défini ?

Je n'ai pas utilisé de nœud pour inclure pdf.js dans cet exemple

Je ne pensais pas que vous utilisiez node.js.

téléchargé la distribution officielle et copié pdf.js dans le répertoire racine de l'échantillon.

PDF.js est une bibliothèque et se compose de nombreux fichiers, par exemple le module pdfjs-dist/build/pdf peut charger le module pdfjs-dist/build/pdf.worker

Pour cette raison, le référencer en tant que « pdf » est correct.

Vous devez toujours utiliser le nom AMD qui est répertorié dans la définition, voir https://github.com/MartinSnyder/pdfjs-with-requirejs/blob/master/pdf.js#L21

Avez-vous essayé l'exemple ci-dessus avec require.config pointant vers la bibliothèque complète ?

Avez-vous essayé l'exemple ci-dessus avec require.config pointant vers la bibliothèque complète ?

Je viens de terminer cela maintenant et cela fonctionne comme vous l'avez dit.

Cela signifie-t-il que vous ne pouvez pas utiliser la distribution "téléchargée" trouvée ici à cette fin ?
https://mozilla.github.io/pdf.js/getting_started/#download

Tant que vous utilisez le package node 'pdfjs-dist', tout va bien, mais la version téléchargée n'est pas censée fonctionner avec cela?

Tant que vous utilisez le package node 'pdfjs-dist', tout va bien, mais la version téléchargée n'est pas censée fonctionner avec cela?

Je pense que ce n'est pas lié au sujet, mais vous pouvez toujours utiliser les fichiers pdf.js/pdf.worker.js de ce package, pointez requirejs 'pdfjs-dist' vers l'emplacement zippé (cela fonctionnera puisque pdf.js et pdf. les fichiers worker.js se trouvent dans le dossier de construction).

Vous devez toujours utiliser le nom AMD qui est répertorié dans la définition, voir https://github.com/MartinSnyder/pdfjs-with-requirejs/blob/master/pdf.js#L21

C'était l'élément clé qui me manquait dans ma compréhension. Merci d'avoir pris le temps de me l'expliquer.

Bonjour, j'ai un problème similaire, donc je ne vais pas en ouvrir un nouveau, mais demandez ici, j'espère que tout va bien.
J'essaie d'implémenter la visionneuse basée sur https://github.com/mozilla/pdf.js/blob/master/examples/components/simpleviewer.js en utilisant require.js. Mais lorsque j'ai besoin à la fois des fichiers pdf.js et pdf_viewer.js, PDFJS.PDFViewer n'est pas défini.

Voici un exemple de dépôt : https://github.com/Lazzi/pdfjs-bower-requirejs

@Lazzi, votre module main.js a l' air vraiment étrange pour AMD, essayez :

define('main', ['pdfjs-dist/build/pdf', 'pdfjs-dist/web/pdf_viewer'], function(pdfjsLib, viewer, require) {

la compatibilité n'est pas AMD, donc je ne sais pas comment cela fonctionnera.

Oui, ce n'est pas AMD, mais require.js prend également en charge ce type de définition de module : http://requirejs.org/docs/api.html#cjsmodule.

Cependant, la modification que vous proposez n'a pas résolu mon problème.

@Lazzi, je vois, essayons le #7332 (le nom d'AMD AFAIK compte)

@yurydelendik Ça marche ! Vous avez été très utile. Merci.

cela peut fonctionner pour vous tout en étant placé dans votre require.config

    map: {
        '*': {
            'pdfjs-dist/build/pdf.worker' : 'path/to/your/install/pdf.worker'
        }
    },

La fonction map est essentiellement un remplacement de chaîne global et le « * » indique les dépendances pour lesquelles utiliser la chaîne de remplacement - principalement utilisée pour inclure différentes versions de bibliothèques pour d'autres bibliothèques. Comme avoir 2 versions de JQuery fonctionnant en parallèle. Soyez prudent en utilisant - puisqu'il ne remplace que les chaînes, vous pourriez finir par remplacer les chemins dans d'autres dépendances s'ils correspondent.

Le '*' dans ce cas ne sera probablement que la dépendance principale de pdf.js.

Comme j'avais aussi un peu de mal avec le référencement correct dans RequireJS, je vais laisser ma solution, qui fait partie de la configuration de RequireJS :

paths: {
    'pdfjs-dist/build/pdf': 'myfolder/pdf.min',
    'pdfjs-dist/build/pdf.worker': 'myfolder/pdf.worker.min'
}

Quand vous faites comme ça, vous n'avez même pas besoin d'affecter le chemin du worker à PDFJS.workerSrc , comme suggéré dans les exemples , car le worker sera trouvé automatiquement.

Merci @dmaxweiler ! J'ai eu du mal avec le même problème - j'avais du mal à charger correctement pdf.js lors de l'utilisation de RequireJS également. Votre solution a fonctionné pour moi ! Impressionnant. Merci de votre aide.