浏览器 DevTools 不允许我在某些行上设置断点,即使在我清理缓存并重新打开后也是如此
Browser DevTools won't let me set breakpoints on certain lines even after I cleaned cache and reopen
我有一个 angular 项目:
- angular 版本为 9.x
- Typescript 版本为 3.8.x
当我在ng serve
中运行时,我可以在每一行设置断点
但是在ng build
运行的时候,有些行无法设置断点
这是我的编译选项:
"optimization": true,
"outputHashing": "none",
"sourceMap": true,
"extractCss": false,
"namedChunks": false,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
这是我的相关代码:
static httpHandle(error: HttpErrorResponse): Observable<HttpEvent<any>>{
let errorMessage = '';
if (error.error instanceof ErrorEvent) {
// client-side error
errorMessage = `Error: ${error.error.message}`;
} else {
// server-side error
errorMessage = `Error Status: ${error.status} -- Message: ${error.message}`;
if (error.status === 404){
errorMessage = "API is not found, Please contact Admin";
}else if (error.status === 400){
errorMessage = error.error;
}else if (error.status === 403){
errorMessage = `You don't have permission to do this`;
}else if (error.status === 401){
errorMessage = `Session timeout, Please relogin`;
}else{
errorMessage = `API Error: ${error.status} ${error.statusText}`;
}
}
console.log(errorMessage);
return throwError(errorMessage);
}
在编译代码中,只有3行可以设置断点,在ng serve
中,所有非灰色行都可以设置断点
我看到有人提到要重新打开 devTools 并清理缓存
Chrome DevTools won't let me set breakpoints on certain lines
我试过了,还是有问题。
我也试过 Chrome 和 Edge,他们有完全相同的问题。
我把optimization
改成false后所有代码行都可以调试,但是生成的文件大了8倍
我有一个 angular 项目:
- angular 版本为 9.x
- Typescript 版本为 3.8.x
当我在ng serve
但是在ng build
这是我的编译选项:
"optimization": true,
"outputHashing": "none",
"sourceMap": true,
"extractCss": false,
"namedChunks": false,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
这是我的相关代码:
static httpHandle(error: HttpErrorResponse): Observable<HttpEvent<any>>{
let errorMessage = '';
if (error.error instanceof ErrorEvent) {
// client-side error
errorMessage = `Error: ${error.error.message}`;
} else {
// server-side error
errorMessage = `Error Status: ${error.status} -- Message: ${error.message}`;
if (error.status === 404){
errorMessage = "API is not found, Please contact Admin";
}else if (error.status === 400){
errorMessage = error.error;
}else if (error.status === 403){
errorMessage = `You don't have permission to do this`;
}else if (error.status === 401){
errorMessage = `Session timeout, Please relogin`;
}else{
errorMessage = `API Error: ${error.status} ${error.statusText}`;
}
}
console.log(errorMessage);
return throwError(errorMessage);
}
在编译代码中,只有3行可以设置断点,在ng serve
中,所有非灰色行都可以设置断点
我看到有人提到要重新打开 devTools 并清理缓存 Chrome DevTools won't let me set breakpoints on certain lines 我试过了,还是有问题。
我也试过 Chrome 和 Edge,他们有完全相同的问题。
我把optimization
改成false后所有代码行都可以调试,但是生成的文件大了8倍