a. 在项目根目录中,运行以下命令:
ng build
b. 打开浏览器,进入应用程序。
c. 按下(ctrl + p)打开源代码,如果看到的结果只是编译后的代码,那么应用程序的源代码没有被正确地打包。
确保开发者工具处于断点模式 有时候,开发者工具会在断点模式下禁止显示源代码。确保你的开发者工具处于非断点模式下。
安装 Source Map 在应用程序开发时,开发者需要对代码进行调试和修改。为了获得更好的调试体验,Angular 12 提供了 Source Map,通过 Source Map,开发者可以方便地调试编译后的代码。要安装 Source Map,你需要按照以下步骤进行操作:
a. 在项目中,打开 angular.json 文件。
b. 找到'sourceMap”属性,并将其设置为 true 。
"build": { "builder": "@angular-devkit/build-angular:browser", "options": { "outputPath": "dist/browser", "index": "src/index.html", "main": "src/main.ts", "polyfills": "src/polyfills.ts", "tsConfig": "src/tsconfig.app.json", "aot": true, "assets": [ "src/assets", "src/favicon.ico" ], "sourceMap": true, // <-- This line "budgets": [ { "type": "initial", "maximumWarning": "2mb", "maximumError": "5mb" } ] }, "configurations": { "production": { "fileReplacements": [ { "replace": "src/environments/environment.ts", "with": "src/environments/environment.prod.ts" } ], "optimization": true, "outputHashing": "all", "sourceMap": true, // <-- This line "namedChunks": false,