我正在尝试配置一个应用程序,以便 chrome 开发工具控制台引用 typescript 源而不是编译的 javascript 源。
我在ngOnInit
我们的仪表板组件中添加了以下行
throw new TypeError('Badaboomm!!');
不幸的是,chrome 将我指向js文件:
DashboardComponent_Host.ngfactory.js? [sm]:1 ERROR TypeError: Badaboomm!!
at DashboardComponent.ngOnInit (app-app-module.js:64409)
at checkAndUpdateDirectiveInline (provider.ts:212)
at checkAndUpdateNodeInline (view.ts:429)
at checkAndUpdateNode (view.ts:389)
这是我们的angular.json
配置:
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"oneval": {
"root": "",
"sourceRoot": "src",
"projectType": "application",
"prefix": "ovl",
"schematics": {
"@schematics/angular:component": {
"styleext": "scss"
}
},
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.app.json",
"assets": ["src/favicon.ico", "src/assets"],
"styles": [
"src/styles/_styles.scss",
"node_modules/ag-grid/dist/styles/ag-grid.css",
"node_modules/ag-grid/dist/styles/theme-fresh.css",
"node_modules/ag-grid/src/styles/ag-theme-material.scss",
"node_modules/ag-grid/src/styles/ag-theme-balham.scss",
"node_modules/flag-icon-css/css/flag-icon.css"
],
"stylePreprocessorOptions": {
"includePaths": [
"src/styles",
"src/styles/global",
"src/styles/overrides",
"src/styles/utils"
]
},
"scripts": []
},
"configurations": {
"production": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"budgets": [
{
"type": "initial",
"maximumWarning": "2mb",
"maximumError": "5mb"
}
]
},
"int": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.int.ts"
}
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true
},
"qua": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.qua.ts"
}
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true
},
"sta": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.sta.ts"
}
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true
}
}
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "oneval:build",
"aot": false,
"sourceMap": {
"scripts": true,
"styles": true,
"vendor": true
}
},
"configurations": {
"production": {
"browserTarget": "oneval:build:production"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "oneval:build"
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": ["src/tsconfig.app.json", "src/tsconfig.spec.json"],
"exclude": ["**/node_modules/**"]
}
}
}
}
},
"defaultProject": "oneval"
}
和出tsconfig.json
配置:
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"downlevelIteration": true,
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"module": "esnext",
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"importHelpers": true,
"target": "es2015",
"typeRoots": ["node_modules/@types"],
"lib": ["es2018", "dom"],
"types": ["jest"],
"paths": {
"@admin/*": ["src/app/admin/*"],
"@core/*": ["src/app/core/*"],
"@cache/*": ["src/app/cache/*"],
"@dashboard/*": ["src/app/dashboard/*"],
"@i18n/*": ["src/app/i18n/*"],
"@material/*": ["src/app/material/*"],
"@project-definition/*": ["src/app/project-definition/*"],
"@prototype/*": ["src/app/prototype/*"],
"@shared/*": ["src/app/shared/*"],
"@validation/*": ["src/app/validation/*"],
"@renault-shared/*": ["src/app/validation/renault/shared/*"],
"@renault-applied/*": ["src/app/validation/renault/applied/*"],
"@renault-standard/*": ["src/app/validation/renault/standard/*"],
"@nissan/*": ["src/app/validation/nissan/*"]
}
}
}
我强烈怀疑这个问题是在...之后开始发生的ng update
。否则,我尝试创建另一个有角度的应用程序,ng new someApp
但问题不会发生。我们使用角度 8。
有人可以帮忙吗?
编辑1:问题(js
来源而不是ts
来源)尤其是在强制重新加载页面时出现......
编辑 2:正如我在聊天中的一条评论中提到的,这个问题似乎与使用 async/await 和 promise 有关。在使用 async/await/promises 之前不会出现此问题。
编辑 3:我尝试通过在新的 Angular 应用程序上使用 async/await/promises 来重现问题,但无济于事......