JS - создание новых рабочих причин 404

Question

Я использую Worker API для создания нового работника, это так просто, как:

var myWorker = new Worker('src/worker.js');

К сожалению, я использую веб-пакет для создания своего проекта и ссылки на src/worker.jsвозвращает 404.

Как я могу использовать его для создания моего работника?

import hardWorker from './src/hardWorker.js';
var myWorker = new Worker(HOW TO PUT HARDWORKER HERE?);

Answer 1

Попробуйте использовать плагин worker-loader для веб-пакета, который можно найти здесь: https://github.com/webpack-contrib/worker-loader

Он регистрирует скрипты, загруженные через него, как веб-работник, и объединяет все вашиработники в основном пакете, который создает webpack.Использовать его в вашем приложении очень просто:

import MyWorker from 'worker-loader!./Worker.js';
const worker = new MyWorker();

Или вы можете добавить параметры конфигурации загрузчика в ваш webpack.config, чтобы все файлы, соответствующие определенному шаблону, загружались и регистрировались как рабочие.У работника-грузчика есть пример этого.

Answer 2

Проблема заключается в том, что рабочий API ожидает URL-адрес для загрузки рабочего скрипта, а веб-пакет пытается объединить все в один файл, то есть файл src/worker.js находится не там, где он должен быть, когда браузер пытается загрузитьit.

Существует несколько вариантов.

• Вы можете вручную скопировать файл worker.js туда, откуда сборка пытается загрузить файл.
• Вы можете настроить веб-пакет для копирования файла в нужное место, используя CopyWebpackPlugin .
• В зависимости от сложности вашего работника, вы можете просто поместить код в строку и создать URL объекта , поэтому браузеру вообще не нужно ничего загружать с сервера.Это подход, который я использовал в прошлом и написал вспомогательную библиотеку для Workers, которая стала немного проще в использовании.

Надеюсь, это поможет!