Tengo esta configuración de Webpack:
{ output: { libraryTarget: "system", ... }, ... }
Estoy tratando de usar un Web Worker. Estoy usando la sintaxis estándar de Webpack 5 :
new Worker(new URL('./MyWorker', import.meta.url));
Ahora Webpack genera Web Worker como un módulo System.js. ¿Cómo puedo cambiarlo a algo diferente, como el módulo ES, sin afectar el paquete principal?
Puede usar chunkFormat
para especificar cuáles son los formatos de fragmento, los trabajadores son por defecto array-push
, https://webpack.js.org/configuration/output/#outputchunkformat .
También puede crear múltiples configuraciones con diferentes objetivos para diferentes entradas.
const config = { // } module.exports = (env) => { if (env.module) { config.entry = //path/to/index config.output.libraryTarget = 'module' } else { config.entry = //path/to/worker config.output.libraryTarget = 'umd' } return config }
Luego, puede compilar por separado sus trabajadores web o fragmentos diferentes de los demás. También puede usar chunkFileName: () =>
junto con eso.
Si desea compilarlo en una sola ejecución, sin tener que ejecutarlo dos veces con diferentes configuraciones, también puede invocar manualmente el compilador del paquete web con ambas configuraciones.
import {Compiler} from 'webpack' // or import webpack from 'webpack' compiler.run(config) compiler.run(config2)
Luego puede ejecutar ambos al mismo tiempo y compilar todo.
Otra opción posible es enabledChunkLoadingTypes
, https://webpack.js.org/configuration/output/#outputenabledchunkloadingtypes , que le permitirá especificar los tipos de carga disponibles para fragmentos que el paquete web usará automáticamente en función de la función de entrada. Nunca lo he usado, así que no sé si funcionará, pero es algo que puedes probar.