Angular 使用角度模板运行ASP.NET Core时出错
我正试图在一台新机器上运行我的工作项目。Angular应用程序在使用Angular 使用角度模板运行ASP.NET Core时出错,angular,asp.net-core,Angular,Asp.net Core,我正试图在一台新机器上运行我的工作项目。Angular应用程序在使用ng serve时运行良好，但当我试图从Visual Studio中运行整个应用程序时，出现以下错误： AggregateException:发生了一个或多个错误。（发生了一个或多个错误。（NPM脚本“start”退出，但未指示Angular CLI正在侦听请求。错误输出为：NPM ERR！路径C:\Windows\System32\package.json 我尝试了以下方法，但没有效果： 选择文件夹ClientApp中的文件
ng serve- 选择文件夹ClientApp中的文件package.json，然后将属性Copy to Output Directory更改为Copy always
- 已删除package.lock.json并运行了npm安装
- 我的package.json中没有
。它是–EXTRACT-CSS“start”：“ng serve - 遵循中提到的所有步骤
"scripts": {
"ng": "ng",
"start": "ng serve --extract-css",
"build": "ng build --extract-css",
...
}
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/animations": "~8.2.5",
"@angular/cdk": "^8.2.0",
"@angular/common": "~8.2.5",
"@angular/compiler": "~8.2.5",
"@angular/core": "~8.2.5",
"@angular/forms": "~8.2.5",
"@angular/http": "^7.2.15",
"@angular/material": "^8.2.0",
"@angular/platform-browser": "~8.2.5",
"@angular/platform-browser-dynamic": "~8.2.5",
"@angular/router": "~8.2.5",
"bootstrap": "^4.3.1",
"hammerjs": "^2.0.8",
"jquery": "^3.4.1",
"ngx-toastr": "^11.2.1",
"rxjs": "~6.4.0",
"tslib": "^1.10.0",
"zone.js": "~0.9.1"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.803.4",
"@angular/cli": "~8.3.4",
"@angular/compiler-cli": "~8.2.5",
"@angular/language-service": "~8.2.5",
"@types/node": "~8.9.4",
"@types/jasmine": "~3.3.8",
"@types/jasminewd2": "~2.0.3",
"codelyzer": "^5.0.0",
"jasmine-core": "~3.4.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~4.1.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.1",
"karma-jasmine": "~2.0.1",
"karma-jasmine-html-reporter": "^1.4.0",
"protractor": "~5.4.0",
"ts-node": "~7.0.0",
"tslint": "~5.15.0",
"typescript": "~3.5.3"
}
如果您的项目代码为follow
"scripts": {
"ng": "ng",
"start": "ng serve --extract-css",
"build": "ng build --extract-css",
...
}
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/animations": "~8.2.5",
"@angular/cdk": "^8.2.0",
"@angular/common": "~8.2.5",
"@angular/compiler": "~8.2.5",
"@angular/core": "~8.2.5",
"@angular/forms": "~8.2.5",
"@angular/http": "^7.2.15",
"@angular/material": "^8.2.0",
"@angular/platform-browser": "~8.2.5",
"@angular/platform-browser-dynamic": "~8.2.5",
"@angular/router": "~8.2.5",
"bootstrap": "^4.3.1",
"hammerjs": "^2.0.8",
"jquery": "^3.4.1",
"ngx-toastr": "^11.2.1",
"rxjs": "~6.4.0",
"tslib": "^1.10.0",
"zone.js": "~0.9.1"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.803.4",
"@angular/cli": "~8.3.4",
"@angular/compiler-cli": "~8.2.5",
"@angular/language-service": "~8.2.5",
"@types/node": "~8.9.4",
"@types/jasmine": "~3.3.8",
"@types/jasminewd2": "~2.0.3",
"codelyzer": "^5.0.0",
"jasmine-core": "~3.4.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~4.1.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.1",
"karma-jasmine": "~2.0.1",
"karma-jasmine-html-reporter": "^1.4.0",
"protractor": "~5.4.0",
"ts-node": "~7.0.0",
"tslint": "~5.15.0",
"typescript": "~3.5.3"
}
有两种方法可以在aspnet core应用程序中运行angular应用程序。假设您作为控制台应用程序（不使用IIS Express）运行应用程序，并且angular应用程序位于
ClientAppStartup.cs中的Configure（）
方法中
app.UseSpa(spa =>
{
spa.Options.SourcePath = "ClientApp";
if (env.IsDevelopment())
{
spa.UseProxyToSpaDevelopmentServer("http://localhost:4200"); // Use this instead to use the angular cli server
}
});
app.UseSpa(spa =>
{
spa.Options.SourcePath = "ClientApp";
if (env.IsDevelopment())
{
spa.UseAngularCliServer(npmScript: "start");
spa.Options.StartupTimeout = TimeSpan.FromSeconds(60); // Increase the timeout if angular app is taking longer to startup
}
});
如果您想启动aspnet core应用程序内部的两个应用程序
将此添加到Startup.cs中的Configure（）
方法中
app.UseSpa(spa =>
{
spa.Options.SourcePath = "ClientApp";
if (env.IsDevelopment())
{
spa.UseProxyToSpaDevelopmentServer("http://localhost:4200"); // Use this instead to use the angular cli server
}
});
app.UseSpa(spa =>
{
spa.Options.SourcePath = "ClientApp";
if (env.IsDevelopment())
{
spa.UseAngularCliServer(npmScript: "start");
spa.Options.StartupTimeout = TimeSpan.FromSeconds(60); // Increase the timeout if angular app is taking longer to startup
}
});
在此之前，请确保npm安装在客户端应用程序文件夹中
有两种方法可以在aspnet core应用程序中运行angular应用程序。假设您作为控制台应用程序（不使用IIS Express）运行应用程序，并且angular应用程序位于ClientApp
文件夹中，则可以检查以下方法
如果要独立运行angular服务器
将此添加到Startup.cs中的Configure（）
方法中
app.UseSpa(spa =>
{
spa.Options.SourcePath = "ClientApp";
if (env.IsDevelopment())
{
spa.UseProxyToSpaDevelopmentServer("http://localhost:4200"); // Use this instead to use the angular cli server
}
});
app.UseSpa(spa =>
{
spa.Options.SourcePath = "ClientApp";
if (env.IsDevelopment())
{
spa.UseAngularCliServer(npmScript: "start");
spa.Options.StartupTimeout = TimeSpan.FromSeconds(60); // Increase the timeout if angular app is taking longer to startup
}
});
如果您想启动aspnet core应用程序内部的两个应用程序
将此添加到Startup.cs中的Configure（）
方法中
app.UseSpa(spa =>
{
spa.Options.SourcePath = "ClientApp";
if (env.IsDevelopment())
{
spa.UseProxyToSpaDevelopmentServer("http://localhost:4200"); // Use this instead to use the angular cli server
}
});
app.UseSpa(spa =>
{
spa.Options.SourcePath = "ClientApp";
if (env.IsDevelopment())
{
spa.UseAngularCliServer(npmScript: "start");
spa.Options.StartupTimeout = TimeSpan.FromSeconds(60); // Increase the timeout if angular app is taking longer to startup
}
});
在此之前，请确保npm安装在客户端应用程序文件夹中
@hrdkisback我已经检查过了。我的版本是一样的。你试过了吗？是的。它是“start”：“ng serve”
。我的包中没有“--EXTRACT-CSS”。jsonTrynpm audit fix
@hrdkisback我已经检查过了。我的版本是一样的。你试过吗？是的。它是“start”：“ng serve”“
我的软件包中没有“-EXTRACT-CSS`。jsonTrynpm audit fix
它是“开始”：“ng serve”。我的软件包中没有“-EXTRACT-CSS`。我在使用Angular 7。我为什么要升级？它是“开始”：“ng serve”。我的软件包中没有“-EXTRACT-CSS`。我在使用Angular 7。我为什么要升级？非常感谢：）UseProxyToSpaDevelopmentServer
解决了问题非常感谢：）UseProxyToSpaDevelopmentServer
解决了问题