我最近从 Webpack 2 升级到 4。Webpack 可以编译，并且大多数应用程序都可以正常工作。似乎是应用程序的损坏部分。我收到错误
NullInjectorError: No provider for InjectionToken config!
我的 module.ts 文件如下
import { enableProdMode, Inject, Injector, ErrorHandler } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppComponent } from './app.component';
import { WsBootstrapService } from '../services/bootstrap';
import { WsBrandTypesService } from '../services/brandTypes';
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { RouterModule, UrlHandlingStrategy, UrlTree } from '@angular/router';
import { FormsModule } from '@angular/forms';
import { HashLocationStrategy, LocationStrategy } from '@angular/common';
import { UpgradeModule, downgradeComponent, downgradeInjectable } from '@angular/upgrade/static';
import { HttpModule } from '@angular/http';
import {HttpClientModule} from '@angular/common/http';
import { BopisTabModule } from './bopis-tab/bopis-tab.module';
import { BopisContainerComponent } from './bopis-tab/bopis-container/bopis-container.component';
import { RewardsModule } from './rewards/rewards.module';
import { RewardsComponent } from './rewards/rewards.component';
import { TransactionHistoryComponent } from './rewards/transaction-history/transaction-history.component';
import { wsdebugProvider, wsbackendProvider, $rootScopeProvider } from './upgrade/injectables';
import { Ng1CcuiDirective } from './upgrade/components';
import './downgrade/downgrade.injectables';
import './downgrade/downgrade.components';
import './rxjs-operators';
import { UserService } from './services/user.service';
import { StoreService } from './services/store.service';
import { WindowRefService } from './services/window-ref.service';
import { FeatureToggleService } from './services/feature-toggle.service';
import { DateService } from './services/date.service';
import { SpinnerService } from './services/spinner.service';
import { AlertService } from './services/alert.service';
import { ExceptionOverlayComponent } from './exception-overlay/exception-overlay.component';
import { ExceptionOverlayService } from './services/exception-overlay.service';
import { ObjToArrayPipe } from './pipes/obj-to-array.pipe';
import { NgTwoErrorHandlerService } from './services/ng-two-error-handler.service';
import { BopisCriticalCountService } from './bopis-tab/services/bopis-critical-count.service';
class HybridUrlHandlingStrategy implements UrlHandlingStrategy {
// use only process the `/hero` url
shouldProcessUrl(url: UrlTree) { return true }
extract(url: UrlTree) { return url; }
merge(url: UrlTree, whole: UrlTree) { return url; }
}
@NgModule({
declarations: [
AppComponent,
Ng1CcuiDirective,
ExceptionOverlayComponent,
ObjToArrayPipe
],
entryComponents: [
AppComponent,
RewardsComponent,
TransactionHistoryComponent
],
imports: [
BrowserModule,
FormsModule,
UpgradeModule,
RouterModule.forRoot([]),
HttpModule,
BopisTabModule,
RewardsModule,
HttpClientModule
],
providers: [
{ provide: ErrorHandler, useClass: NgTwoErrorHandlerService },
wsdebugProvider,
wsbackendProvider,
$rootScopeProvider,
{ provide: 'WsBootstrapService', useClass: WsBootstrapService },
{ provide: 'WsBrandTypeService', useClass: WsBrandTypesService },
UserService,
StoreService,
WindowRefService,
FeatureToggleService,
DateService,
SpinnerService,
AlertService,
ExceptionOverlayService,
NgTwoErrorHandlerService,
BopisCriticalCountService
]
})
export class AppModule {
constructor( @Inject(UpgradeModule) private upgrade: UpgradeModule) {
}
ngDoBootstrap() {
this.upgrade.bootstrap(document.body, ['wsframework']);
}
}完整的错误信息是
VM28381:4697 Error: StaticInjectorError(AppModule)[MaskService -> InjectionToken config]:
StaticInjectorError(Platform: core)[MaskService -> InjectionToken config]:
NullInjectorError: No provider for InjectionToken config!
at _NullInjector.get (core.js:1224)
at resolveToken (core.js:1522)
at tryResolveToken (core.js:1464)
at StaticInjector.get (core.js:1332)
at resolveToken (core.js:1522)
at tryResolveToken (core.js:1464)
at StaticInjector.get (core.js:1332)
at resolveNgModuleDep (core.js:11117)
at NgModuleRef_.get (core.js:12350)
at resolveDep (core.js:12840)我的 package.json 文件如下
{
"name": "ccui",
"version": "1.0.0",
"private": true,
"description": "Care center UI.",
"scripts": {
"postinstall": "npm rebuild node-sass",
"test:ng:ci": "npm run jest:ng -- --coverage --ci",
"test:ng:dev": "npm run jest:ng -- --watch",
"test:wc:ci": "npm run jest:wc -- --coverage --ci",
"test:wc:dev": "npm run jest:wc -- --watch",
"test:ci": "npm-run-all test:wc:ci test:ng:ci",
"jest:ng": "jest --config ./jest/config.json ",
"jest:wc": "jest --config ./jest/config.wc.json ",
"prejest:ng": "npm run templatecache",
"test": "npm-run-all --parallel test:wc:dev test:ng:dev ",
"test:mvn": "npm run test:ci",
"lint:ng2": "ng lint",
"lint:ng1": "eslint ng1",
"lint": "npm-run-all lint:ng2 lint:ng1",
"build-ccui": "npm run build:prod",
"rm:dist": "rimraf dist",
"prebuild:dev": "npm-run-all rm:dist concat",
"build:dev": "webpack --env.build=dev --progress --profile --colors",
"rm:index": "rimraf ./index.html",
"predev": "npm-run-all rm:index concat",
"dev": "npm-run-all --parallel concat:watch dev:server ",
"dev:server": "webpack-dev-server --env.build=dev --port=4200 ",
"prebuild:prod": "npm-run-all rm:dist concat",
"build:prod": "webpack --env.build=prod --progress --profile --colors",
"concat": "gulp concat",
"concat:watch": "gulp concat:watch",
"templatecache": "gulp templatecache",
"precommit": "npm run jest:ng -- -o && npm run jest:wc -- -o"
},
"engines": {
"node": "8.1.0"
},
"keywords": [],
"author": "WSI",
"dependencies": {
"@angular-devkit/core": "0.5.5",
"@angular/animations": "5.2.9",
"@angular/common": "5.2.9",
"@angular/compiler": "5.2.9",
"@angular/core": "5.2.10",
"@angular/forms": "5.2.9",
"@angular/http": "5.2.10",
"@angular/platform-browser": "5.2.9",
"@angular/platform-browser-dynamic": "5.2.9",
"@angular/router": "5.2.9",
"@angular/upgrade": "4.3.0",
"@ngtools/webpack": "6.0.0-beta.8",
"@webcomponents/webcomponentsjs": "1.0.22",
"angular": "1.6.4",
"angular-cookies": "1.6.4",
"angular-i18n": "1.6.4",
"angular-mocks": "1.6.4",
"angular-route": "1.6.4",
"angular-sanitize": "1.6.4",
"angular-ui-mask": "1.8.7",
"browser-split": "0.0.1",
"class-list": "0.1.1",
"core-js": "2.4.1",
"font-awesome": "4.7.0",
"html-element": "2.2.0",
"identity-obj-proxy": "3.0.0",
"jquery": "3.2.1",
"lodash.clonedeep": "4.5.0",
"lodash.flowright": "3.5.0",
"lodash.intersection": "4.4.0",
"lodash.isempty": "4.4.0",
"lodash.isinteger": "4.0.4",
"lodash.isplainobject": "4.0.6",
"mitt": "1.1.3",
"moment": "2.18.1",
"moment-timezone": "0.5.13",
"ngx-mask": "2.4.4",
"npm": "5.8.0",
"preact": "8.2.7",
"primeng": "4.1.0",
"raf": "3.4.0",
"reflect-metadata": "0.1.10",
"regenerator-runtime": "0.11.1",
"rxjs": "5.5.2",
"source-map-loader": "0.2.3",
"webpack-cli": "2.0.13",
"zone.js": "0.8.11"
},
"devDependencies": {
"@angular-devkit/build-optimizer": "0.5.6",
"@angular/cli": "1.7.2",
"@angular/compiler-cli": "5.2.9",
"@skatejs/ssr": "0.19.1",
"@types/jasmine": "2.5.36",
"@types/jest": "22.1.3",
"@types/node": "6.0.73",
"add-stream": "1.0.0",
"babel-core": "6.26.0",
"babel-loader": "7.1.2",
"babel-plugin-root-import": "5.1.0",
"babel-plugin-transform-es2015-modules-commonjs": "6.26.0",
"babel-plugin-transform-react-jsx": "6.24.1",
"babel-preset-env": "1.6.1",
"babel-preset-es2015": "6.24.1",
"babel-preset-stage-3": "6.24.1",
"circular-dependency-plugin": "5.0.2",
"codelyzer": "3.1.2",
"copy-webpack-plugin": "4.5.1",
"css-loader": "0.28.4",
"eslint": "4.15.0",
"eslint-plugin-angular": "3.1.1",
"extract-text-webpack-plugin": "4.0.0-beta.0",
"file-loader": "1.1.11",
"gulp": "3.9.1",
"gulp-angular-templatecache": "2.0.0",
"gulp-concat": "2.6.1",
"html-loader": "0.5.5",
"html-webpack-plugin": "3.0.7",
"husky": "0.14.3",
"jasmine-marbles": "0.2.0",
"jasmine-spec-reporter": "4.1.1",
"jest": "21.2.1",
"jest-preset-angular": "4.0.1",
"jest-sonar-reporter": "1.3.0",
"license-webpack-plugin": "1.3.1",
"lodash": "4.17.4",
"node-sass": "4.8.3",
"npm-run-all": "4.1.2",
"null-loader": "0.1.1",
"postcss-loader": "2.1.3",
"postcss-url": "7.3.2",
"promise.prototype.finally": "3.0.0",
"protractor": "4.0.14",
"raw-loader": "0.5.1",
"rimraf": "2.6.1",
"sass-loader": "6.0.6",
"script-loader": "0.7.2",
"smart-banner-webpack-plugin": "3.0.1",
"style-loader": "0.13.2",
"ts-node": "3.0.6",
"tslint": "5.4.3",
"typescript": "2.4.2",
"uglifyjs-webpack-plugin": "1.2.4",
"webpack": "4.4.1",
"webpack-dev-server": "3.1.1",
"write-file-webpack-plugin": "4.2.0"
},
"repository": {},
"jestSonar": {
"reportPath": "coverage",
"reportFile": "unit-tests.xml",
"indent": 4
}
}我感谢任何和所有的帮助。