я попытался запустить свое веб-приложение angular6 в веб-воркере, как описано здесь
из-за отсутствия ng eject
в angular6 я использую это для создания пользовательского файла конфигурации веб-пакета.
workerLoader.ts
import './polyfills.ts';
import '@angular/core';
import '@angular/common';
import { platformWorkerAppDynamic } from '../node_modules/@angular/platform-webworker-dynamic';
import { AppModule } from './app/app.module';
platformWorkerAppDynamic().bootstrapModule(AppModule);
main.ts
import { enableProdMode } from '@angular/core';
import { bootstrapWorkerUi,WORKER_UI_LOCATION_PROVIDERS } from '@angular/platform-webworker';
import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
if (environment.production) {
enableProdMode();
}
bootstrapWorkerUi('webworker.chunk.js',WORKER_UI_LOCATION_PROVIDERS);
app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { MapComponent } from './map/map.component';
import {
WorkerAppModule,
WORKER_APP_LOCATION_PROVIDERS,
WORKER_UI_LOCATION_PROVIDERS
} from '@angular/platform-webworker';
import { APP_BASE_HREF } from '@angular/common'
@NgModule({
declarations: [
AppComponent,
// some components
],
imports: [
BrowserModule,
//some imports
WorkerAppModule,
],
providers: [
{
provide: APP_BASE_HREF,
useValue: '/'
},
WORKER_APP_LOCATION_PROVIDERS
],
bootstrap: [AppComponent]
})
export class AppModule { }
webpack.config.js
const webpack = require('webpack');
const path = require('path');
const { AotPlugin } = require('@ngtools/webpack');
module.exports = {
"entry": {
"main": [
"./src/main.ts",
],
"polyfills": [
"./src/polyfills.ts"
],
"styles": [
"./src/styles.css"
],
"webworker": [
"./src/workerLoader.ts"
]
}
,
"output": {
"path": path.join(process.cwd(), "dist"),
"filename": "[name].bundle.js",
"chunkFilename": "[id].chunk.js"
},
optimization: {
splitChunks: {
cacheGroups: {
commons: {
test: /[\\/]node_modules[\\/]/,
name: 'vendor',
chunks: 'all'
}
}
}
},
}
проблема в том, что после входа в браузер я получаю сообщение об ошибке webworker.chunk.js:1 Uncaught ReferenceError: window is not defined
, и строка, создающая эту ошибку, (window["webpackJsonp"] = window["webpackJsonp"] || []).push([["webworker"],{
я нахожу тот же вопрос, но у меня это не сработало.
Как решить проблему?
обновление:
мой вопрос помечен как возможный дубликат, но я сам сослался на этот вопрос и подчеркнул, что это не сработало для меня.
обновление:
Насколько я знаю, веб-воркер не имеет доступа к глобальным переменным, таким как window
, и ошибка какая-то странная, потому что он хочет получить доступ к window
в веб-воркере. Я думаю, что причиной ошибки является неправильная конфигурация в конфигурационном файле веб-пакета. изображение ошибки