Saya cuba mencipta aplikasi web dengan fungsi push-to-talk (PTT) menggunakan React JS. Salah satu teknologi yang akan kami gunakan ialah Mumble.

Demo https://voice.johni0702.de/?address=voice.johni0702.de&port=443/demo pada https://github.com/Johni0702/mumble-web repositori ini berfungsi dengan baik. Saya cuba menjalankan repositori pada mesin tempatan saya tetapi mendapat beberapa ralat yang berbeza.

Ralat pemasangan

Saya mengklon menggunakan arahan npm install pada mesin tempatan saya yang menjalankan Windows OS dan Node JS v16 dan cuba memasang semua perpustakaan dalam folder akar repositori tetapi mendapat ralat berikut.

verbose stack Error: command failed
verbose stack     at ChildProcess.<anonymous> (C:\Users\LENOVO\AppData\Roaming\nvm\v16.18.0\node_modules\npm\node_modules\@npmcli\promise-spawn\lib\index.js:63:27)
verbose stack     at ChildProcess.emit (node:events:513:28)
verbose stack     at maybeClose (node:internal/child_process:1100:16)
verbose stack     at Process.ChildProcess._handle.onexit (node:internal/child_process:304:5)
verbose pkgid [email protected]
verbose cwd C:\Users\LENOVO\AppData\Local\npm-cache\_cacache\tmp\git-cloneZtPlJ2
verbose Windows_NT 10.0.22621
verbose node v16.18.0
verbose npm  v8.19.2
error code 1
error path C:\Users\LENOVO\AppData\Local\npm-cache\_cacache\tmp\git-cloneZtPlJ2
error command failed
error command C:\WINDOWS\system32\cmd.exe /d /s /c npm run compile
verbose exit 1
timing npm Completed in 8638ms
verbose code 1

Kemudian saya menggunakan NVM untuk menukar versi Node JS daripada v16 kepada v14. Saya cuba memasang semua perpustakaan pada repositori menggunakan arahan npm install sekali lagi, tetapi kemudian saya mendapat satu lagi ralat berbeza.

verbose stack Error: [email protected] prepare: `rm -rf dist && npm run build`
verbose stack Exit status 1
verbose stack     at EventEmitter.<anonymous> (C:\Users\LENOVO\AppData\Roaming\nvm\v14.21.2\node_modules\npm\node_modules\npm-lifecycle\index.js:332:16)
verbose stack     at EventEmitter.emit (events.js:400:28)
verbose stack     at ChildProcess.<anonymous> (C:\Users\LENOVO\AppData\Roaming\nvm\v14.21.2\node_modules\npm\node_modules\npm-lifecycle\lib\spawn.js:55:14)
verbose stack     at ChildProcess.emit (events.js:400:28)
verbose stack     at maybeClose (internal/child_process.js:1088:16)
verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:296:5)
verbose pkgid [email protected]
verbose cwd D:\A.ing\Works\Others\Lacak-and-Valid\Exercises\React-Js\mumble-web-2
verbose Windows_NT 10.0.22621
verbose argv "C:\Program Files\nodejs\node.exe" "C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js" "i"
verbose node v14.21.2
verbose npm  v6.14.17
error code ELIFECYCLE
error errno 1
error [email protected] prepare: `rm -rf dist && npm run build`
error Exit status 1
error Failed at the [email protected] prepare script.
error This is probably not a problem with npm. There is likely additional logging output above.
verbose exit [ 1, true ]

Saya cuba mengalih keluar kod "prepare": "rm -rf dist && npm run build", (baris 45) dalam fail package.json. Saya tidak tahu sama ada mengalih keluar kod itu akan memberi kesan kepada menjalankan aplikasi pada masa hadapan. Saya juga mencari dalam talian dan menemui jawapan ini https://stackoverflow.com/a/62744648/8339172 untuk mengosongkan cache npm, menjana semula fail package-lock.json, dan memadam folder node_modules. Saya melakukan semua ini dan kemudian menjalankan arahan "npm install" sekali lagi.

Tiada kesilapan kali ini.

Ralat Masa Jalan

Bersambung dari bahagian sebelumnya, saya cuba menjalankan akar repositori dengan menjalankan arahan npm run watch. Saya tidak tahu sama ada ini betul kerana saya biasanya memasukkan perintah npm start untuk menjalankan React JS secara setempat. Saya tidak melihat sebarang port yang dikonfigurasikan pada fail package.json, jadi saya membuka alamat localhost:8080 pada penyemak imbas saya. Malangnya, tiada apa-apa di sana. Pelayar berkata 这个网站无法访问。本地主机拒绝连接.

Folder Aplikasi

Bersambung dari bahagian sebelumnya, saya cuba menjalankan fail index.html dengan mengklik dua kali dalam folder app. Apl itu nampaknya ranap kerana saya melihat ralat pada konsol penyemak imbas seperti yang ditunjukkan dalam tangkapan skrin di bawah. Ini ialah mesej ralat:

Uncaught SyntaxError: Cannot use import statement outside a module (at index.js:1:1)

Soalan

Saya ingin belajar cara membuat demo pada repositori https://github.com/Johni0702/mumble (https://voice.johni0702.de/?address=voice.johni0702.de&port=443/demo) - web. Soalan saya ialah:

1. Yang manakah kod sumber aplikasi demo? Adakah ia dari folder akar repositori atau folder aplikasi?
2. Teruskan dengan soalan pertama, bagaimana saya boleh memasang semua kebergantungan yang diperlukan untuk apl demo secara tempatan?
3. Bersambung dengan soalan pertama dan kedua, bagaimana untuk menjalankan aplikasi demo secara tempatan?

Persekitaran

Sistem pengendalian: Windows 11

Nod: 14.21.2, 16.18.0 dan 18.13.0 (boleh ditukar)