Peerjs: Tidak dapat mengimpor Peer 1.0.1 di aplikasi Angular 8

Dibuat pada 10 Jul 2019 · 9Komentar · Sumber: peers/peerjs

Halo!
Saya mencoba menggunakan peerJ dengan sudut 8 tetapi gagal.
Saya tidak dapat mengimpornya ke aplikasi.

Saya telah membuat proyek kecil (https://github.com/furozen/PeerJs-example) untuk menunjukkan masalah ini:

1

import * as Peer from 'peerjs';

kompilasi kesalahan:

ERROR in src/app/app.component.ts:14:16 - error TS2351: Cannot use 'new' with an expression whose type lacks a call or construct signature.

14     let peer = new Peer();
                  ~~~~~~~~~~

  src/app/app.component.ts:3:1
    3 import * as Peer from 'peerjs';
      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Type originates at this import. A namespace-style import cannot be called or constructed, and will cause a failure at runtime. Consider using a default import or import require here instead.

2

import { Peer } from 'peerjs'

kompilasi kesalahan:

ERROR in src/app/app.component.ts:3:10 - error TS2305: Module '"../../node_modules/peerjs"' has no exported member 'Peer'.

3 import { Peer } from 'peerjs'
         ~~~~

3

import Peer from 'peerjs'

kompilasi kesalahan:

WARNING in ./node_modules/peerjs/dist/peerjs.min.js 1:292-296
Critical dependency: the request of a dependency is an expression

runtime:

Uncaught ReferenceError: parcelRequire is not defined
    at push../node_modules/peerjs/dist/peerjs.min.js.parcelRequire.vHo1 (peerjs.min.js:1)
    at Object../node_modules/peerjs/dist/peerjs.min.js (peerjs.min.js:1)
    at __webpack_require__ (bootstrap:79)
    at Module../src/app/app.component.ts (main.js:112)
    at __webpack_require__ (bootstrap:79)
    at Module../src/app/app.module.ts (app.component.ts:11)
    at __webpack_require__ (bootstrap:79)
    at Module../src/main.ts (main.ts:1)
    at __webpack_require__ (bootstrap:79)
    at Object.0 (main.ts:12)

4

import Peer = require('peerjs');

kompilasi kesalahan:


    ERROR in src/app/app.component.ts(3,1): error TS1202: Import assignment cannot be used when targeting ECMAScript modules. Consider using 'import * as ns from "mod"', 'import {a} from "mod"', 'import d from "mod"', or another module format instead

runtime:

AppComponent_Host.ngfactory.js? [sm]:1 ERROR ReferenceError: Peer is not defined
    at new AppComponent (app.component.ts:15)
    at createClass (core.js:27863)
    at createDirectiveInstance (core.js:27685)
    at createViewNodes (core.js:38315)
    at createRootView (core.js:38187)
    at callWithDebugContext (core.js:39716)
    at Object.debugCreateRootView [as createRootView] (core.js:38953)
    at ComponentFactory_.create (core.js:26827)
    at ComponentFactoryBoundToModule.create (core.js:22791)
    at ApplicationRef.bootstrap (core.js:35343)

bug

Sumber

furozen

Komentar yang paling membantu

Maaf! itu tambalan di index.html yang saya tambahkan dan lupa untuk menghapus:

  <script>
    window.global  = window;
    var parcelRequire;
  </script>

tanpa tambalan ini saya dapatkan:

Uncaught ReferenceError: parcelRequire is not defined
    at push../node_modules/peerjs/dist/peerjs.min.js.parcelRequire.vHo1 (peerjs.min.js:1)
    at Object../node_modules/peerjs/dist/peerjs.min.js (peerjs.min.js:1)
    at __webpack_require__ (bootstrap:79)
    at Module../src/app/app.component.ts (main.js:112)
    at __webpack_require__ (bootstrap:79)
    at Module../src/app/app.module.ts (app.component.ts:12)
    at __webpack_require__ (bootstrap:79)
    at Module../src/main.ts (main.ts:1)
    at __webpack_require__ (bootstrap:79)
    at Object.0 (main.ts:12)

dalam waktu proses.

sehingga Anda dapat memeriksa kesalahan di sana: https://github.com/furozen/PeerJs-example

furozen pada 12 Jul 2019

👍8 ❤2 🎉1

Semua 9 komentar

Mengubah modul menjadi "CommonJs" membantu menghilangkan kesalahan kompilasi tetapi tidak memperbaiki kesalahan runtime: kasus still # 3.

itu

ReferenceError: parcelRequire is not defined

dapat ditautkan dengan masalah ini: https://github.com/parcel-bundler/parcel/issues/1401

furozen pada 10 Jul 2019

👍1

Cara yang benar adalah import Peer from "peerjs" , yang Anda dapatkan adalah peringatan webpack:

PERINGATAN di ./node_modules/peerjs/dist/peerjs.min.js 1: 292-296
Ketergantungan kritis: permintaan ketergantungan adalah ekspresi

Ini seharusnya tidak memengaruhi pustaka atau proses kompilasi.

https://github.com/parcel-bundler/parcel/issues/2883

kidandcat pada 11 Jul 2019

Cara yang benar adalah import Peer from "peerjs" , yang Anda dapatkan adalah peringatan webpack:
PERINGATAN di ./node_modules/peerjs/dist/peerjs.min.js 1: 292-296
Ketergantungan kritis: permintaan ketergantungan adalah ekspresi
Ini seharusnya tidak memengaruhi pustaka atau proses kompilasi.
parsel-bundler / parsel # 2883

Ya, itu adalah pendekatan kerja, terima kasih.
Untuk menyimpulkan:
Anda harus memiliki "esModuleInterop": true, di tsconfig.json
dan impor lib sebagai: import Peer dari "peerjs"

furozen pada 11 Jul 2019

Maaf! itu tambalan di index.html yang saya tambahkan dan lupa untuk menghapus:

  <script>
    window.global  = window;
    var parcelRequire;
  </script>

tanpa tambalan ini saya dapatkan:

Uncaught ReferenceError: parcelRequire is not defined
    at push../node_modules/peerjs/dist/peerjs.min.js.parcelRequire.vHo1 (peerjs.min.js:1)
    at Object../node_modules/peerjs/dist/peerjs.min.js (peerjs.min.js:1)
    at __webpack_require__ (bootstrap:79)
    at Module../src/app/app.component.ts (main.js:112)
    at __webpack_require__ (bootstrap:79)
    at Module../src/app/app.module.ts (app.component.ts:12)
    at __webpack_require__ (bootstrap:79)
    at Module../src/main.ts (main.ts:1)
    at __webpack_require__ (bootstrap:79)
    at Object.0 (main.ts:12)

dalam waktu proses.

sehingga Anda dapat memeriksa kesalahan di sana: https://github.com/furozen/PeerJs-example

furozen pada 12 Jul 2019

👍8 ❤2 🎉1

Saya pikir ini bukan BUG, Ini berfungsi di proyek angular 8 saya.
Anda harus menambahkan file index.d.ts ke proyek. Anda dapat menemukan file ini di direktori root.
JANGAN perlu mengimpor peerj! hanya untuk menggunakan kelas Peer, karena telah dideklarasikan dalam file index.d.ts.

linewei pada 22 Nov 2019

Jadi saya telah menambahkan peerjs (v1.1.0) ke aplikasi Angular. Awalnya, saya tidak memiliki masalah atau kesalahan. Peerj tidak benar-benar digunakan sampai Anda menavigasi melalui 2-3 langkah dan berhasil. Saya menambahkan bagian lain ke aplikasi, yang menjalankan peerjs setelah mendarat dan saat itulah saya mulai melihat kesalahan parcelRequire. Saya menambahkan inisialisasi parcelRequire dari https://github.com/peers/peerjs/issues/552#issuecomment -510976519 dan tampaknya berfungsi sekarang. Saya menduga ada kondisi balapan di suatu tempat, tetapi saya belum menghabiskan waktu untuk menggali lebih jauh.

jloosli pada 22 Nov 2019

Masalah yang sama di Angular 9. Saya menambahkan esModuleInterop: true dan allowSyntheticDefaultImports: true ke tsconfig.json tanpa hasil. Ada berita?

adriano-di-giovanni pada 22 Apr 2020

ini berfungsi untuk saya sebagai perbaikan suhu di index.html sesuai posting @furozen .

<script>
    var parcelRequire;
  </script>

vincent-seibus pada 2 Jun 2020

👍4

Ini tetap menjadi masalah pada tahun 2021 ketika mengimpor peerj ke dalam proyek elemen-lit .
Masalahnya tampaknya berasal dari fakta bahwa keluaran yang dibangun dari peerj dimulai dengan:

parcelRequire=

daripada, Anda tahu, mendeklarasikan variabel

var parcelRequire=

Akibatnya, banyak hal yang rusak dalam proyek elemen-lit saya, sementara browser dengan senang hati mengangkat variabel ini ke cakupan global dan melanjutkannya.