Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angular/27.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Angular 如何设置中间件来运行react&;在asp.net核心MVC应用程序中并排使用角度应用程序?_Angular_Reactjs_Asp.net Core_Asp Net Core Spa Services - Fatal编程技术网

Angular 如何设置中间件来运行react&;在asp.net核心MVC应用程序中并排使用角度应用程序?

Angular 如何设置中间件来运行react&;在asp.net核心MVC应用程序中并排使用角度应用程序?,angular,reactjs,asp.net-core,asp-net-core-spa-services,Angular,Reactjs,Asp.net Core,Asp Net Core Spa Services,我在同一个asp.net core 2.1应用程序中有一个angular&react应用程序(clientapp1和clientapp2)。我可以在它的文件夹clientapp1和clientapp2中运行应用程序。它们在自己的港口运行,运行良好 我添加了以下代码来分支路径。当我使用端点http://localhost:5000/clientapp1并在我运行http://localhost:5000/clientapp2 app.Map("/clientapp1", clientapp1 =&

我在同一个asp.net core 2.1应用程序中有一个angular&react应用程序(clientapp1和clientapp2)。我可以在它的文件夹clientapp1clientapp2中运行应用程序。它们在自己的港口运行,运行良好

我添加了以下代码来分支路径。当我使用端点
http://localhost:5000/clientapp1
并在我运行
http://localhost:5000/clientapp2

app.Map("/clientapp1", clientapp1 =>
{
    clientapp1.UseSpa(spa =>
    {
        spa.Options.SourcePath = "ClientApp1";

        if (env.IsDevelopment())
        {
            spa.UseAngularCliServer(npmScript: "start");
        }
    });
});

app.Map("/clientapp2", clientapp2 =>
{
    clientapp2.UseSpa(spa =>
    {
        spa.Options.SourcePath = "ClientApp2";

        if (env.IsDevelopment())
        {
            spa.UseReactDevelopmentServer(npmScript: "start");
        }
    });
});
在应用程序根文件夹中运行命令
dotnet run
时,asp.net核心应用程序不工作。我得到以下错误。错误表示它在文件夹中查找文件

角度:

反应:

我必须设置什么配置来告诉这两个应用程序在哪里查找文件


如果我将代码
clientapp1.UseSpa(spa=>
更改为
app.UseSpa(spa=>
),我可以使它工作。但是副作用是
http://localhost:5000/clientapp2
不起作用。

您必须有两个脚本,并在脚本中添加--SERVICE path和--base href。通常情况下,您的package.json中有

{
  "name": "client-app",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start:app1": "ng serve --base-href=/clientapp1/ --serve-path=/clientapp1", 
    "start:app2": "ng serve --base-href=/clientapp2/ --serve-path=/clientapp2", 
    "build": "ng build",
     ...
  },
  ....
}
在startup.cs中,例如

//for app1
if (env.IsDevelopment())
{
   spa.UseReactDevelopmentServer(npmScript: "start:app1");
}
//for app2
if (env.IsDevelopment())
{
   spa.UseReactDevelopmentServer(npmScript: "start:app2");
}

我想知道在Angular应用程序的index.html中将
/clientapp1
添加到
base href
中是否可以解决这个问题。我对react知之甚少,不知道是否需要类似的东西。我试过了,但没有成功。最近,我在as use razor页面和as change包中编写了一个脚本的绝对路径我的应用程序中的ientapp1&
clientapp2
是angular和react。因此启动脚本无法工作。react应用程序的clientapp2文件夹中有自己的
包。json
。我尝试了您对angular应用程序的建议,但我收到错误
拒绝执行来自的脚本'https://localhost:5001/clientapp1/polyfills.bundle.js“贝考se其MIME类型('text/html')不可执行,并且启用了严格的MIME类型检查。
。该错误会在所有
*.bundle.js
文件中重复。我查看了您的stackoverflow问题。您的应用程序是一个angular应用程序,并且只有一个中间件分支。在我的应用程序中,有两个-一个用于angular,一个用于react。您始终可以尝试运行ng ser我已经独立了,看,但我不确定这是否是你想要的。我不太了解react,但我认为问题在于你忘记了——服务路径。(对不起,我想我帮不了你更多)。奇怪的是,你使用同一个脚本来服务两个不同的应用程序