【发布时间】：2021-02-15 18:10:32
【问题描述】：
我有一个适用于 Angular Web App 的生产版本。 我的 Azure 帐户（免费层级）具有 AppService 计划、应用服务、资源组、存储帐户、KeyVault、SQL Server 和 SignalR 的有效订阅。
我想使用 Azure 部署我的 Web 应用程序。我的源代码控制是 Azure DevOps。
我已按照教程进行操作：
https://docs.microsoft.com/en-us/azure/app-service/deploy-continuous-deployment
https://angular.schule/blog/2019-08-ng-deploy
但基本上总是在最后一步失败： ng运行：部署
根据我输入的内容，我会收到两种类型的错误消息。
如果我输入 ng run projectName:deploy （这是我认为正确的名称），我会得到
An unhandled exception occurred: Project target does not exist.
如果我运行 projectname:deploy（这是我的项目名称，大小写错误），我会得到
An unhandled exception occurred: Project "projectname" does not exist.
所以里面好像触发了一些不同的错误信息
clientapp\node_modules\@angular\cli\node_modules\@angular-devkit\architect\node\node-modules-architect-host.js
我尝试像 Angular8 : ng run => 'Project target does not exist.' when using i18n 那样调整它，但这并没有让我变得更聪明。
我的 angular.json
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"projectName": {
"root": "",
"sourceRoot": "src",
"projectType": "application",
"prefix": "app",
"schematics": {},
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"progress": true,
"extractCss": true,
"outputPath": "dist/projectName",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.app.json",
"assets": [ "src/assets", "src/manifest.webmanifest", "src/web.config" ],
"styles": [
],
"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,
"serviceWorker": true,
"ngswConfigPath": "ngsw-config.json"
}
}
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "projectName:build"
},
"configurations": {
"production": {
"browserTarget": "projectName:build:production"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "projectName:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.spec.json",
"karmaConfig": "src/karma.conf.js",
"styles": ["styles.css"],
"scripts": [],
"assets": [
"src/assets",
"src/web.config",
"src/manifest.webmanifest"
]
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": ["src/tsconfig.app.json", "src/tsconfig.spec.json"],
"exclude": ["**/node_modules/**"]
}
},
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "e2e/protractor.conf.js",
"devServerTarget": "projectName:serve"
}
},
"server": {
"builder": "@angular-devkit/build-angular:server",
"options": {
"outputPath": "dist/dogface/server",
"main": "server.ts",
"tsConfig": "tsconfig.server.json"
},
"configurations": {
"production": {
"outputHashing": "media",
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"sourceMap": false,
"optimization": true
}
}
},
"serve-ssr": {
"builder": "@nguniversal/builders:ssr-dev-server",
"options": {
"browserTarget": "projectName:build",
"serverTarget": "projectName:server"
},
"configurations": {
"production": {
"browserTarget": "projectName:build:production",
"serverTarget": "projectName:server:production"
}
}
},
"prerender": {
"builder": "@nguniversal/builders:prerender",
"options": {
"browserTarget": "projectName:build:production",
"serverTarget": "projectName:server:production",
"routes": [
"/"
]
},
}
}
},
"defaultProject": "projectName"
}
我的 web.config
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
<staticContent>
<mimeMap fileExtension=".json" mimeType="application/json" />
<remove fileExtension=".woff"/>
<mimeMap fileExtension=".woff" mimeType="application/font-woff" />
<mimeMap fileExtension=".woff2" mimeType="font/woff2" />
</staticContent>
<rewrite>
<rules>
<rule name="Angular" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
</conditions>
<action type="Rewrite" url="/" />
</rule>
</rules>
</rewrite>
</system.webServer>
</configuration>
我的 index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>DogFace</title>
<base href="/"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<link rel="manifest" href="/manifest.webmanifest">
<meta name="theme-color" content="#1976d2">
</head>
<body>
<app-root>
Loading...
</app-root>
<noscript>Please enable JavaScript to continue using this application.</noscript>
</body>
</html>
我的 tsconfig.json
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"module": "esnext",
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es5",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2017",
"DOM.Iterable",
"dom"
]
}
}
我已经尝试了好几天了，绕着圈子跑。我已更新到 Angular 11，是否添加了 @azure/ng-deploy（登录后显示：您没有任何活动订阅，但是当我在 CMD-Shell 中创建存储帐户列表时，我看到了我的实际订阅和当我在 CMD 中登录时：），我删除并读取了 node_modules 文件夹，将 tsconfig.json 中的 es2015 更改为 es5，在构建 --prod 之前安装了 npm，从 cmd-shell 授权了我的 azure 帐户。
此线程中建议的所有内容均无效angular ng serve command throws error: An unhandled exception occurred: Project does not exist
我确实发现了这个与 相关的错误报告，但它已经快一年了，而且似乎已经解决了。 https://github.com/Azure/ng-deploy-azure/pull/92
我的问题： 这里还有什么会影响我的部署？
我在提交的文件中犯了什么错误？
为什么 Angular CLI 找不到我的活动订阅？一年半前，我知道免费订阅是可能的，而且文档中没有其他说明？
当我使用我的帐户登录 Microsoft 时，有一半时间会显示“我们找不到具有该用户名的帐户。尝试另一个..' 但我确定这是一个好帐户，因为当我想用另一个帐户登录时，它说我不能，因为我用他找不到的帐户登录（我什至没有开玩笑）
我想在我扩大到更大/更昂贵的 AppServicePlan 之前启动并运行它，以避免在付费服务时出现所有这些混乱 :)
我要求太多了吗？ ))
感谢您的帮助
【问题讨论】：
-
这里是 GitHub 上的issue，同样的问题可以参考。
-
@HiGuy 是的，我已经看到 GitHub 问题，按照 S/O 链接（如我的问题中所述）并按照建议进行操作：将 browserTargets 指向 projectName 并添加“服务器”、“服务” -ssr' & 'prerender' 到 angular.json 中的架构师。当我运行 projectName:deploy 时，我仍然得到项目目标不存在
标签： angular azure deployment azure-devops