React-pdf: "export 'EventBus' was not found in 'pdfjs-dist/lib/web/ui_utils'

Created on 1 Oct 2020 · 8Comments · Source: wojtekmaj/react-pdf

Before you start - checklist

[x] I have read documentation in README
[x] I have checked sample and test suites to see real life basic implementation
[x] I have checked if this question is not already asked

What are you trying to achieve? Please describe.

I am working in rails 6 app and within rails 6 app i'm creating one of my module in react and in that module i'm using react-pdf library but somehow i'm getting this error when i'm importing react-pdf components from react-pdf library:
ERROR in ./node_modules/react-pdf/dist/esm/eventBus.js
"export 'EventBus' was not found in 'pdfjs-dist/lib/web/ui_utils'
i'm getting above error when i wrote like this
import {Document, Page, pdfjs} from 'react-pdf';
but i'm not getting error when i wrote like this
const pdfjs = require('pdfjs-dist/es5/build/pdf');

i have also tried to create a separate react app from scratch and follow the getting started example and it is working perfectly in react app
Any idea guys where i'm going wrong?

question

Source

sulemanidreesi

👍3

All 8 comments

What's the react-pdf version?

Looks like the problem is in this file which imports EventBus from this file and reexports it. This file, however, definitely has EventBus export 🤔

Perhaps try somewhere in your code to check what gets exported properly:

import * as UIUtils from 'pdfjs-dist/lib/web/ui_utils';

console.log(UIUtils);
console.log(UIUtils.EventBus);

wojtekmaj on 5 Oct 2020

I have the same issue :

Error with import {Document, Page, pdfjs} from 'react-pdf'; but not with const pdfjs = require('pdfjs-dist/es5/build/pdf');

Even if there is no compilation error with const pdfjs = require('pdfjs-dist/es5/build/pdf');
In web inspector console i have TypeError: Cannot set property 'pdfjsLib' of undefined

react version : 16.13.1
react-pdf version : 5.0.0
rails version : 6.0.3.2

I have "export 'EventBus' (imported as 'UIUtils') was not found in 'pdfjs-dist/lib/web/ui_utils'

When

import * as UIUtils from 'pdfjs-dist/lib/web/ui_utils';

console.log(UIUtils);
console.log(UIUtils.EventBus);

trouvainGregoire on 8 Oct 2020

Are you by any chance trying to run React-PDF server-side?

wojtekmaj on 9 Oct 2020

Are you by any chance trying to run React-PDF server-side?

No, it's client-side

I use https://github.com/reactjs/react-rails gem

trouvainGregoire on 9 Oct 2020

I use https://github.com/reactjs/react-rails gem

Automatically renders React server-side and client-side

🤔 I think there's your problem. You can't render PDF's server-side.

wojtekmaj on 9 Oct 2020

Automatically renders React server-side and client-side

🤔 I think there's your problem. You can't render PDF's server-side.

🤔 but server-side it's not enabled by default and i have prerender:false https://github.com/reactjs/react-rails#server-side-rendering

trouvainGregoire on 9 Oct 2020

I also use react-rails. With react-pdf 5 I also get the same errors when importing as import { pdfjs, Document, Page } from 'react-pdf':

ERROR in ./node_modules/react-pdf/dist/esm/eventBus.js 2:19-27
"export 'EventBus' was not found in 'pdfjs-dist/lib/web/ui_utils'
    at HarmonyImportSpecifierDependency._getErrors (/var/www/app_name/node_modules/webpack/lib/dependencies/HarmonyImportSpecifierDependency.js:109:11)
    at HarmonyImportSpecifierDependency.getErrors (/var/www/app_name/node_modules/webpack/lib/dependencies/HarmonyImportSpecifierDependency.js:68:16)
    at Compilation.reportDependencyErrorsAndWarnings (/var/www/app_name/node_modules/webpack/lib/Compilation.js:1463:22)
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1258:10
    at AsyncSeriesHook.eval [as callAsync] (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
    at AsyncSeriesHook.lazyCompileHook (/var/www/app_name/node_modules/tapable/lib/Hook.js:154:20)
    at Compilation.finish (/var/www/app_name/node_modules/webpack/lib/Compilation.js:1253:28)
    at /var/www/app_name/node_modules/webpack/lib/Compiler.js:672:17
    at _done (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:9:1)
    at eval (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:20:22)
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1185:12
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1097:9
    at processTicksAndRejections (internal/process/task_queues.js:75:11)

ERROR in ./node_modules/react-pdf/dist/esm/entry.js 11:0-5
"export 'default' (imported as 'pdfjs') was not found in 'pdfjs-dist/build/pdf'
    at HarmonyImportSpecifierDependency._getErrors (/var/www/app_name/node_modules/webpack/lib/dependencies/HarmonyImportSpecifierDependency.js:109:11)
    at HarmonyImportSpecifierDependency.getErrors (/var/www/app_name/node_modules/webpack/lib/dependencies/HarmonyImportSpecifierDependency.js:68:16)
    at Compilation.reportDependencyErrorsAndWarnings (/var/www/app_name/node_modules/webpack/lib/Compilation.js:1463:22)
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1258:10
    at AsyncSeriesHook.eval [as callAsync] (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
    at AsyncSeriesHook.lazyCompileHook (/var/www/app_name/node_modules/tapable/lib/Hook.js:154:20)
    at Compilation.finish (/var/www/app_name/node_modules/webpack/lib/Compilation.js:1253:28)
    at /var/www/app_name/node_modules/webpack/lib/Compiler.js:672:17
    at _done (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:9:1)
    at eval (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:20:22)
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1185:12
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1097:9
    at processTicksAndRejections (internal/process/task_queues.js:75:11)

ERROR in ./node_modules/react-pdf/dist/esm/Document.js 95:28-33
"export 'default' (imported as 'pdfjs') was not found in 'pdfjs-dist/build/pdf'
    at HarmonyImportSpecifierDependency._getErrors (/var/www/app_name/node_modules/webpack/lib/dependencies/HarmonyImportSpecifierDependency.js:109:11)
    at HarmonyImportSpecifierDependency.getErrors (/var/www/app_name/node_modules/webpack/lib/dependencies/HarmonyImportSpecifierDependency.js:68:16)
    at Compilation.reportDependencyErrorsAndWarnings (/var/www/app_name/node_modules/webpack/lib/Compilation.js:1463:22)
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1258:10
    at AsyncSeriesHook.eval [as callAsync] (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
    at AsyncSeriesHook.lazyCompileHook (/var/www/app_name/node_modules/tapable/lib/Hook.js:154:20)
    at Compilation.finish (/var/www/app_name/node_modules/webpack/lib/Compilation.js:1253:28)
    at /var/www/app_name/node_modules/webpack/lib/Compiler.js:672:17
    at _done (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:9:1)
    at eval (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:20:22)
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1185:12
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1097:9
    at processTicksAndRejections (internal/process/task_queues.js:75:11)

ERROR in ./node_modules/react-pdf/dist/esm/Document.js 196:34-39
"export 'default' (imported as 'pdfjs') was not found in 'pdfjs-dist/build/pdf'
    at HarmonyImportSpecifierDependency._getErrors (/var/www/app_name/node_modules/webpack/lib/dependencies/HarmonyImportSpecifierDependency.js:109:11)
    at HarmonyImportSpecifierDependency.getErrors (/var/www/app_name/node_modules/webpack/lib/dependencies/HarmonyImportSpecifierDependency.js:68:16)
    at Compilation.reportDependencyErrorsAndWarnings (/var/www/app_name/node_modules/webpack/lib/Compilation.js:1463:22)
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1258:10
    at AsyncSeriesHook.eval [as callAsync] (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
    at AsyncSeriesHook.lazyCompileHook (/var/www/app_name/node_modules/tapable/lib/Hook.js:154:20)
    at Compilation.finish (/var/www/app_name/node_modules/webpack/lib/Compilation.js:1253:28)
    at /var/www/app_name/node_modules/webpack/lib/Compiler.js:672:17
    at _done (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:9:1)
    at eval (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:20:22)
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1185:12
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1097:9
    at processTicksAndRejections (internal/process/task_queues.js:75:11)

ERROR in ./node_modules/react-pdf/dist/esm/Page/AnnotationLayer.js 191:8-13
"export 'default' (imported as 'pdfjs') was not found in 'pdfjs-dist/build/pdf'
    at HarmonyImportSpecifierDependency._getErrors (/var/www/app_name/node_modules/webpack/lib/dependencies/HarmonyImportSpecifierDependency.js:109:11)
    at HarmonyImportSpecifierDependency.getErrors (/var/www/app_name/node_modules/webpack/lib/dependencies/HarmonyImportSpecifierDependency.js:68:16)
    at Compilation.reportDependencyErrorsAndWarnings (/var/www/app_name/node_modules/webpack/lib/Compilation.js:1463:22)
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1258:10
    at AsyncSeriesHook.eval [as callAsync] (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
    at AsyncSeriesHook.lazyCompileHook (/var/www/app_name/node_modules/tapable/lib/Hook.js:154:20)
    at Compilation.finish (/var/www/app_name/node_modules/webpack/lib/Compilation.js:1253:28)
    at /var/www/app_name/node_modules/webpack/lib/Compiler.js:672:17
    at _done (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:9:1)
    at eval (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:20:22)
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1185:12
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1097:9
    at processTicksAndRejections (internal/process/task_queues.js:75:11)

ERROR in ./node_modules/react-pdf/dist/esm/Page/PageSVG.js 89:25-30
"export 'default' (imported as 'pdfjs') was not found in 'pdfjs-dist/build/pdf'
    at HarmonyImportSpecifierDependency._getErrors (/var/www/app_name/node_modules/webpack/lib/dependencies/HarmonyImportSpecifierDependency.js:109:11)
    at HarmonyImportSpecifierDependency.getErrors (/var/www/app_name/node_modules/webpack/lib/dependencies/HarmonyImportSpecifierDependency.js:68:16)
    at Compilation.reportDependencyErrorsAndWarnings (/var/www/app_name/node_modules/webpack/lib/Compilation.js:1463:22)
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1258:10
    at AsyncSeriesHook.eval [as callAsync] (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
    at AsyncSeriesHook.lazyCompileHook (/var/www/app_name/node_modules/tapable/lib/Hook.js:154:20)
    at Compilation.finish (/var/www/app_name/node_modules/webpack/lib/Compilation.js:1253:28)
    at /var/www/app_name/node_modules/webpack/lib/Compiler.js:672:17
    at _done (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:9:1)
    at eval (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:20:22)
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1185:12
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1097:9
    at processTicksAndRejections (internal/process/task_queues.js:75:11)

ERROR in ./node_modules/react-pdf/dist/esm/entry.js 12:0-42
"export 'default' (reexported as 'pdfjs') was not found in 'pdfjs-dist/build/pdf'
    at HarmonyExportImportedSpecifierDependency._getErrors (/var/www/app_name/node_modules/webpack/lib/dependencies/HarmonyExportImportedSpecifierDependency.js:395:11)
    at HarmonyExportImportedSpecifierDependency.getErrors (/var/www/app_name/node_modules/webpack/lib/dependencies/HarmonyExportImportedSpecifierDependency.js:354:16)
    at Compilation.reportDependencyErrorsAndWarnings (/var/www/app_name/node_modules/webpack/lib/Compilation.js:1463:22)
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1258:10
    at AsyncSeriesHook.eval [as callAsync] (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
    at AsyncSeriesHook.lazyCompileHook (/var/www/app_name/node_modules/tapable/lib/Hook.js:154:20)
    at Compilation.finish (/var/www/app_name/node_modules/webpack/lib/Compilation.js:1253:28)
    at /var/www/app_name/node_modules/webpack/lib/Compiler.js:672:17
    at _done (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:9:1)
    at eval (eval at create (/var/www/app_name/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:20:22)
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1185:12
    at /var/www/app_name/node_modules/webpack/lib/Compilation.js:1097:9
    at processTicksAndRejections (internal/process/task_queues.js:75:11)

Now I use an older version of react-pdf (4.0.6), everything works there.

imustafin on 12 Oct 2020

I had the same issue and managed to get it working by excluding the pdfjs-dist folder from babel transpilation through adding the following to my environment.js file, as described here

const nodeModulesLoader = environment.loaders.get('nodeModules')
if (!Array.isArray(nodeModulesLoader.exclude)) {
    nodeModulesLoader.exclude = (nodeModulesLoader.exclude == null)
        ? []
        : [nodeModulesLoader.exclude]
}
nodeModulesLoader.exclude.push(/pdfjs-dist/)