Как использовать Web Workers в приложении create-реагировать с загрузчиком работника? - PullRequest
0 голосов
/ 10 июня 2018

Я пытаюсь внедрить Web Workers в свое приложение React, чтобы разделить одно соединение WebSockets на нескольких вкладках.Я использую зависимость работника-загрузчика для загрузки в Web Workers.

К сожалению, я даже не могу заставить работать простого выделенного веб-работника.

App.jsx:

import React, { Component } from 'react';

// eslint-disable-next-line
import myWorker from 'worker-loader!./worker.js';

class App extends Component {
  constructor(props) {
    super();

    this.state = {};
  }

componentWillMount() {
    if(window.SharedWorker) {
      console.log(myWorker);
      myWorker.port.postMessage('Hello worker');

      myWorker.port.onmessage = function(e) {
        console.log('Message received from worker');
        console.log(e.data);
      }
    }

worker.js:

onconnect = function(e) {
  var port = e.ports[0];

  port.onmessage = function(e) {
    var workerResult = 'Result: ' + (e.data[0] * e.data[1]);
    port.postMessage(workerResult);
  }
}

При загрузке страницы появляется следующая ошибка веб-пакета:

webpack error Я не могу использовать конфигурационный стиль использования worker-loader, потому что это требует некоторых изменений в конфигурации webpack.Этот конфиг не может быть отредактирован из-за create-реакции-приложения.Я мог бы, если бы я изгнал create-реакции-приложение, но у этого есть некоторые недостатки.

Почему это не работает?У кого-нибудь есть идеи?

Заранее спасибо,

Майк

1 Ответ

0 голосов
/ 10 июня 2018

Как указал @KevBot, мне нужно было создать новый экземпляр Worker:

// eslint-disable-next-line
import Worker from 'worker-loader!./worker.js';

let myWorker = new Worker();
...