Warning | Error: ENOENT - Failed to parse source map | no such file or directory

Describe the bug Following the readme in the repository, I decided to implement the Html5Qrcode solution so that I can scan both in desktop and browser.

Prior to that I did setup a ReactJS example application (using create react app) to implement the QR Code reader solution.

To Reproduce Steps to reproduce the behavior:

1. Clone this repository
2. Use the terminal to run npm install
3. Run npm start
4. Wait for the app to start
5. See error in the Terminal

Expected behavior No warnings or errors when running the application.

Screenshots N/A

Desktop:

• OS: macOS 11.6.2
• Browser firefox
• Version 95.0.2 (64-bit)

Smartphone:

• Device: iPhone Xs
• OS: iOS15.1
• Browser firefox, safari
• Version latest

Additional context

The application in the repository is also not showing the camera stream in the mobile phone’s browser

Logs

Compiled with warnings.

Failed to parse source map from '/path/to/react_app/src/node_modules/src/camera.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/camera.ts'

Failed to parse source map from '/path/to/react_app/src/node_modules/src/code-decoder.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/code-decoder.ts'

Failed to parse source map from '/path/to/react_app/src/node_modules/src/core.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/core.ts'

Failed to parse source map from '/path/to/react_app/src/node_modules/src/experimental-features.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/experimental-features.ts'

Failed to parse source map from '/path/to/react_app/src/node_modules/src/html5-qrcode-scanner.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/html5-qrcode-scanner.ts'

Failed to parse source map from '/path/to/react_app/src/node_modules/src/html5-qrcode.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/html5-qrcode.ts'

Failed to parse source map from '/path/to/react_app/src/node_modules/src/image-assets.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/image-assets.ts'

Failed to parse source map from '/path/to/react_app/src/node_modules/src/index.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/index.ts'

Failed to parse source map from '/path/to/react_app/src/node_modules/src/native-bar-code-detector.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/native-bar-code-detector.ts'

Failed to parse source map from '/path/to/react_app/src/node_modules/src/state-manager.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/state-manager.ts'

Failed to parse source map from '/path/to/react_app/src/node_modules/src/storage.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/storage.ts'

Failed to parse source map from '/path/to/react_app/src/node_modules/src/strings.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/strings.ts'

Failed to parse source map from '/path/to/react_app/src/node_modules/src/ui.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/ui.ts'

Failed to parse source map from '/path/to/react_app/src/node_modules/src/utils.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/utils.ts'

Failed to parse source map from '/path/to/react_app/src/node_modules/src/zxing-html5-qrcode-decoder.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/zxing-html5-qrcode-decoder.ts'

Failed to parse source map from '/path/to/react_app/src/node_modules/html5-qrcode/third_party/index.js.map' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/html5-qrcode/third_party/index.js.map'

src/pages/Dashboard/Dashboard.tsx
  Line 1:10:  'useEffect' is defined but never used  @typescript-eslint/no-unused-vars

Search for the keywords to learn more about each warning.
To ignore, add // eslint-disable-next-line to the line before.

assets by status 2.6 MiB [cached] 2 assets
assets by path . 2.12 KiB
  asset index.html 1.67 KiB [emitted]
  asset asset-manifest.json 458 bytes [emitted]
cached modules 2.45 MiB (javascript) 31.3 KiB (runtime) [cached] 144 modules
./src/pages/Dashboard/Dashboard.tsx 4.14 KiB [built]

WARNING in ./node_modules/html5-qrcode/esm/camera.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/path/to/react_app/src/node_modules/src/camera.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/camera.ts'
 @ ./node_modules/html5-qrcode/esm/html5-qrcode-scanner.js 7:0-41 313:6-40
 @ ./node_modules/html5-qrcode/esm/index.js 2:0-60 2:0-60
 @ ./src/pages/Dashboard/Dashboard.tsx 7:0-43 47:4-26 50:23-34
 @ ./src/App.tsx 9:0-52 34:40-49
 @ ./src/index.tsx 7:0-24 11:33-36

WARNING in ./node_modules/html5-qrcode/esm/code-decoder.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/path/to/react_app/src/node_modules/src/code-decoder.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/code-decoder.ts'
 @ ./node_modules/html5-qrcode/esm/html5-qrcode.js 29:0-49 125:22-37
 @ ./node_modules/html5-qrcode/esm/index.js 1:0-45 1:0-45
 @ ./src/pages/Dashboard/Dashboard.tsx 7:0-43 47:4-26 50:23-34
 @ ./src/App.tsx 9:0-52 34:40-49
 @ ./src/index.tsx 7:0-24 11:33-36

WARNING in ./node_modules/html5-qrcode/esm/core.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/path/to/react_app/src/node_modules/src/core.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/core.ts'
 @ ./node_modules/html5-qrcode/esm/index.js 3:0-53 3:0-53
 @ ./src/pages/Dashboard/Dashboard.tsx 7:0-43 47:4-26 50:23-34
 @ ./src/App.tsx 9:0-52 34:40-49
 @ ./src/index.tsx 7:0-24 11:33-36

WARNING in ./node_modules/html5-qrcode/esm/experimental-features.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/path/to/react_app/src/node_modules/src/experimental-features.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/experimental-features.ts'
 @ ./node_modules/html5-qrcode/esm/html5-qrcode.js 30:0-76 125:114-180
 @ ./node_modules/html5-qrcode/esm/index.js 1:0-45 1:0-45
 @ ./src/pages/Dashboard/Dashboard.tsx 7:0-43 47:4-26 50:23-34
 @ ./src/App.tsx 9:0-52 34:40-49
 @ ./src/index.tsx 7:0-24 11:33-36

WARNING in ./node_modules/html5-qrcode/esm/html5-qrcode-scanner.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/path/to/react_app/src/node_modules/src/html5-qrcode-scanner.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/html5-qrcode-scanner.ts'
 @ ./node_modules/html5-qrcode/esm/index.js 2:0-60 2:0-60
 @ ./src/pages/Dashboard/Dashboard.tsx 7:0-43 47:4-26 50:23-34
 @ ./src/App.tsx 9:0-52 34:40-49
 @ ./src/index.tsx 7:0-24 11:33-36

WARNING in ./node_modules/html5-qrcode/esm/html5-qrcode.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/path/to/react_app/src/node_modules/src/html5-qrcode.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/html5-qrcode.ts'
 @ ./node_modules/html5-qrcode/esm/index.js 1:0-45 1:0-45
 @ ./src/pages/Dashboard/Dashboard.tsx 7:0-43 47:4-26 50:23-34
 @ ./src/App.tsx 9:0-52 34:40-49
 @ ./src/index.tsx 7:0-24 11:33-36

WARNING in ./node_modules/html5-qrcode/esm/image-assets.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/path/to/react_app/src/node_modules/src/image-assets.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/image-assets.ts'
 @ ./node_modules/html5-qrcode/esm/html5-qrcode-scanner.js 4:0-68 619:31-48 641:29-44
 @ ./node_modules/html5-qrcode/esm/index.js 2:0-60 2:0-60
 @ ./src/pages/Dashboard/Dashboard.tsx 7:0-43 47:4-26 50:23-34
 @ ./src/App.tsx 9:0-52 34:40-49
 @ ./src/index.tsx 7:0-24 11:33-36

WARNING in ./node_modules/html5-qrcode/esm/index.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/path/to/react_app/src/node_modules/src/index.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/index.ts'
 @ ./src/pages/Dashboard/Dashboard.tsx 7:0-43 47:4-26 50:23-34
 @ ./src/App.tsx 9:0-52 34:40-49
 @ ./src/index.tsx 7:0-24 11:33-36

WARNING in ./node_modules/html5-qrcode/esm/native-bar-code-detector.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/path/to/react_app/src/node_modules/src/native-bar-code-detector.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/native-bar-code-detector.ts'
 @ ./node_modules/html5-qrcode/esm/code-decoder.js 2:0-69 11:76-111 12:25-48
 @ ./node_modules/html5-qrcode/esm/html5-qrcode.js 29:0-49 125:22-37
 @ ./node_modules/html5-qrcode/esm/index.js 1:0-45 1:0-45
 @ ./src/pages/Dashboard/Dashboard.tsx 7:0-43 47:4-26 50:23-34
 @ ./src/App.tsx 9:0-52 34:40-49
 @ ./src/index.tsx 7:0-24 11:33-36

WARNING in ./node_modules/html5-qrcode/esm/state-manager.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/path/to/react_app/src/node_modules/src/state-manager.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/state-manager.ts'
 @ ./node_modules/html5-qrcode/esm/index.js 4:0-58 4:0-58
 @ ./src/pages/Dashboard/Dashboard.tsx 7:0-43 47:4-26 50:23-34
 @ ./src/App.tsx 9:0-52 34:40-49
 @ ./src/index.tsx 7:0-24 11:33-36

WARNING in ./node_modules/html5-qrcode/esm/storage.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/path/to/react_app/src/node_modules/src/storage.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/storage.ts'
 @ ./node_modules/html5-qrcode/esm/html5-qrcode-scanner.js 5:0-49 51:36-56
 @ ./node_modules/html5-qrcode/esm/index.js 2:0-60 2:0-60
 @ ./src/pages/Dashboard/Dashboard.tsx 7:0-43 47:4-26 50:23-34
 @ ./src/App.tsx 9:0-52 34:40-49
 @ ./src/index.tsx 7:0-24 11:33-36

WARNING in ./node_modules/html5-qrcode/esm/strings.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/path/to/react_app/src/node_modules/src/strings.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/strings.ts'
 @ ./node_modules/html5-qrcode/esm/html5-qrcode.js 27:0-47 195:17-57 199:15-61 442:23-71 445:21-71 716:25-58
 @ ./node_modules/html5-qrcode/esm/index.js 1:0-45 1:0-45
 @ ./src/pages/Dashboard/Dashboard.tsx 7:0-43 47:4-26 50:23-34
 @ ./src/App.tsx 9:0-52 34:40-49
 @ ./src/index.tsx 7:0-24 11:33-36

WARNING in ./node_modules/html5-qrcode/esm/ui.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/path/to/react_app/src/node_modules/src/ui.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/ui.ts'
 @ ./node_modules/html5-qrcode/esm/html5-qrcode-scanner.js 6:0-44 242:26-46
 @ ./node_modules/html5-qrcode/esm/index.js 2:0-60 2:0-60
 @ ./src/pages/Dashboard/Dashboard.tsx 7:0-43 47:4-26 50:23-34
 @ ./src/App.tsx 9:0-52 34:40-49
 @ ./src/index.tsx 7:0-24 11:33-36

WARNING in ./node_modules/html5-qrcode/esm/utils.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/path/to/react_app/src/node_modules/src/utils.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/utils.ts'
 @ ./node_modules/html5-qrcode/esm/html5-qrcode.js 28:0-47 80:11-61 469:16-66
 @ ./node_modules/html5-qrcode/esm/index.js 1:0-45 1:0-45
 @ ./src/pages/Dashboard/Dashboard.tsx 7:0-43 47:4-26 50:23-34
 @ ./src/App.tsx 9:0-52 34:40-49
 @ ./src/index.tsx 7:0-24 11:33-36

WARNING in ./node_modules/html5-qrcode/esm/zxing-html5-qrcode-decoder.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/path/to/react_app/src/node_modules/src/zxing-html5-qrcode-decoder.ts' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/src/zxing-html5-qrcode-decoder.ts'
 @ ./node_modules/html5-qrcode/esm/code-decoder.js 1:0-71 14:25-48
 @ ./node_modules/html5-qrcode/esm/html5-qrcode.js 29:0-49 125:22-37
 @ ./node_modules/html5-qrcode/esm/index.js 1:0-45 1:0-45
 @ ./src/pages/Dashboard/Dashboard.tsx 7:0-43 47:4-26 50:23-34
 @ ./src/App.tsx 9:0-52 34:40-49
 @ ./src/index.tsx 7:0-24 11:33-36

WARNING in ./node_modules/html5-qrcode/third_party/zxing-js.umd.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/path/to/react_app/src/node_modules/html5-qrcode/third_party/index.js.map' file: Error: ENOENT: no such file or directory, open '/path/to/react_app/src/node_modules/html5-qrcode/third_party/index.js.map'
 @ ./node_modules/html5-qrcode/esm/zxing-html5-qrcode-decoder.js 1:0-53 6:68-95 6:134-159 6:200-227 6:268-295 6:336-363 6:405-433 6:478-509 6:551-579 6:616-639 6:679-705 6:744-769 6:810-837 6:877-903 6:949-981 6:1020-1045 6:1084-1109 6:1160-1197 9:9-14 17:14-51 34:27-50 35:30-68 36:27-45 36:50-71
 @ ./node_modules/html5-qrcode/esm/code-decoder.js 1:0-71 14:25-48
 @ ./node_modules/html5-qrcode/esm/html5-qrcode.js 29:0-49 125:22-37
 @ ./node_modules/html5-qrcode/esm/index.js 1:0-45 1:0-45
 @ ./src/pages/Dashboard/Dashboard.tsx 7:0-43 47:4-26 50:23-34
 @ ./src/App.tsx 9:0-52 34:40-49
 @ ./src/index.tsx 7:0-24 11:33-36

[raulra08]

Solution found. Closing the issue.

Solution

1. Create a .env file in the same directory where your package.json is
2. Define the following variable GENERATE_SOURCEMAP=false as suggested by @d8corp

Thanks @d8corp and @nazebzurati

[raulra08]

Hello, @Gayatri19670 This issue is closed and resolved.

However, it seems that your post belongs somewhere else as you seem to be using a very different dependency in your learning project, the auth0 library. You might want to check if there are any similar issues raised in the past with the team who built that library. In case this is helpful, using the npm website one can find out who maintains a library. Good luck!