Angular项目部署后DevTools无法查看.ts源文件求助
Angular部署后无法在DevTools查看.ts源文件问题
本地开发时,浏览器DevTools中能正常看到.ts源文件,但将项目部署到任意环境后,就无法查看这些源文件了。我已经在angular.json的development配置中设置了sourceMap: true,也配置了serve下的browserTarget,但问题仍然存在。
相关配置文件
1. angular.json完整内容
{ "$schema": "./node_modules/@angular/cli/lib/config/schema.json", "version": 1, "newProjectRoot": "projects", "projects": { "UI-App": { "projectType": "application", "root": "", "sourceRoot": "src", "prefix": "app", "architect": { "build": { "builder": "@angular-devkit/build-angular:browser", "options": { "outputPath": "dist", "index": "src/index.html", "main": "src/main.ts", "polyfills": ["zone.js"], "tsConfig": "tsconfig.app.json", "inlineStyleLanguage": "scss", "assets": ["src/favicon.ico", "src/assets"], "styles": [ "@fabric/components/legacy-theme.css", "@fabric/components/theme.css", "@fabric/primeng-styles/light-theme.css", "./node_modules/primeicons/primeicons.css", "./node_modules/primeng/resources/primeng.min.css", "./node_modules/primeflex/primeflex.css", "src/styles.scss" ], "scripts": [], "allowedCommonJsDependencies": ["color"] }, "defaultConfiguration": "production", "configurations": { "production": { "optimization": { "scripts": true, "styles": true, "fonts": false }, "outputHashing": "all", "budgets": [ { "type": "initial", "maximumWarning": "2mb", "maximumError": "5mb" }, { "type": "anyComponentStyle", "maximumWarning": "6kb", "maximumError": "10kb" } ] }, "development": { "buildOptimizer": false, "optimization": false, "vendorChunk": true, "extractLicenses": false, "sourceMap": true, "namedChunks": true, "fileReplacements": [ { "replace": "src/environments/environment.ts", "with": "src/environments/environment.prod.ts" } ] } } }, "serve": { "builder": "@angular-devkit/build-angular:dev-server", "options": { "browserTarget": "ui-angular-demo:build", "host": "localhost.gm.com", "ssl": true, "port": 8081 }, "configurations": { "production": { "browserTarget": "UI-App:build:production" }, "development": { "browserTarget": "UI-App:build:development" } }, "defaultConfiguration": "development" }, "extract-i18n": { "builder": "@angular-devkit/build-angular:extract-i18n", "options": { "browserTarget": "UI-App:build" } }, "lint": { "builder": "@angular-eslint/builder:lint", "options": { "lintFilePatterns": ["src/**/*.ts", "src/**/*.html"] } } } } }, "cli": { "schematicCollections": ["@angular-eslint/schematics"] }, "schematics": { "@schematics/angular:component": { "style": "scss", "standalone": true }, "@schematics/angular:directive": { "standalone": true }, "@schematics/angular:pipe": { "standalone": true }, "@schematics/angular:application": { "strict": true }, "@angular-eslint/schematics:application": { "setParserOptionsProject": true }, "@angular-eslint/schematics:library": { "setParserOptionsProject": true } } }
2. package.json脚本片段
{ "name": "UI-App", "version": "0.0.0", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "jest", "lint": "ng lint", "lint:fix": "ng lint --fix", "format": "prettier --write src", "format:check": "prettier --check src", "e2e": "ng e2e", "clean": "node scripts/clean.mjs" } }
截图对比
本地开发时DevTools:可正常看到src文件夹结构

部署后DevTools:看不到src文件夹,按Ctrl+P也无法找到源文件

参考项目DevTools(部署到Dev环境):正常显示src文件夹结构,这是我需要实现的效果

内容的提问来源于stack exchange,提问作者E S
相关产品推荐
相关产品推荐

