Прозрачный код дает TypeError: не является конструктором - PullRequest
0 голосов
/ 12 февраля 2019

У меня есть модуль JS, который будет использоваться внутри реактивного проекта (CRA).

index.js выглядит,

export { EvtScoket } from './socket';

socket.js выглядит как

import openSocket from 'socket.io-client';

export default class EvtSocket {
  constructor(socketURL) {
    this.socket = openSocket(socketURL);
  }
  joinAsParticipant = () => {
    this.socket.emit('participantJoin', 'session');
  };

  joinAsSpeaker = () => {
    this.socket.emit('speakerJoin', 'lobby');
  };

  subscribeToInitialQuesitons = (cb) => {
    this.socket.on('initialQuestions', (questions) => {
      cb(null, questions);
    });
  };

  subscribeToQuestion = (cb) => {
    this.socket.on('newQuestionGot', (question) => cb(null, question));
  };

  sendQuestion = (question) => {
    this.socket.emit('newQuestionOn', question);
  };
}

babelrc похоже на

{
  "presets": [
    [
      "@babel/preset-env",
      {
        // "targets": {
        //   "esmodules": true
        // },
        "modules": "commonjs"
      }
    ]
    // "@babel/preset-react"
  ],
  "plugins": [
    "@babel/plugin-proposal-class-properties",
    "@babel/plugin-transform-classes",
    "@babel/plugin-proposal-export-default-from",
    "@babel/plugin-proposal-export-namespace-from",
    "@babel/plugin-transform-runtime",
    "@babel/plugin-syntax-export-extensions",
    [
      "@babel/plugin-transform-modules-commonjs",
      {
        "allowTopLevelThis": true
      }
    ]
  ]
}

Когда я перенес этот код и использовал его, React App дает

TypeError: eventtalk_core___WEBPACK_IMPORTED_MODULE_7__.EvtSocket is not a constructor

Он импортируется и используется как

import { EvtSocket } from 'evt-core';

...
 constructor(){
   ...
   this.socket = new EvtSocket('xxx');
 }

Первоначальная ошибка была с classProperties, поэтому мне нужно настроить babel.

Если я console.log(EvtScoket) выдает undefined

Когда я импортирую файл сокетапрямо как evt-core/lib/socket это работает кажется что-то не так с экспортом в index.js

Ответы [ 2 ]

0 голосов
/ 12 февраля 2019

Здесь может быть несколько причин, но похоже, что в вашем экспорте есть опечатка:

export { EvtScoket } from './socket'; // typo in "Socket", EvtScoket/EvtSocket

import { EvtSocket } from 'evt-core'; // importing a named export that does not exist

Исправьте эту опечатку и посмотрите, начнет ли работать снова.Быстрый тест - просто импортировать неправильно набранный модуль, например,

import { EvtScoket } from 'evt-core';
0 голосов
/ 12 февраля 2019

В вашем файле socket.js вы экспортируете свой класс как default экспорт.

Это означает, что вы должны импортировать его следующим образом:

import EvtSocket from './socket.js`

Вы можете найти большеинформация об импорте из MDN Docs

...