У меня есть модуль 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