Azure App Service中的点网发布错误-错误：找不到模块'@ angular / core'

Question

这是我的csproj文件。当我通过运行“ dotnet publish”并导航到发布文件夹并运行“ dotnet MyProject.Web.dll”来测试本地部署时，它返回一个错误，提示它缺少package.json。

在Azure中，它返回一个错误，提示它找不到@ angular / core。

  <ItemGroup>
    <PackageReference Include="FluentValidation.AspNetCore" Version="7.3.3" />
    <PackageReference Include="graphiql" Version="1.1.0" />
    <PackageReference Include="GraphQL" Version="2.0.0" />
    <PackageReference Include="Microsoft.AspNetCore.App" />
    <PackageReference Include="Microsoft.Data.Sqlite" Version="2.1.0" />
    <PackageReference Include="Microsoft.Data.Sqlite.Core" Version="2.1.0" />
    <PackageReference Include="Microsoft.EntityFrameworkCore.Sqlite" Version="2.1.0" />
    <PackageReference Include="Microsoft.EntityFrameworkCore.Sqlite.Core" Version="2.1.0" />
    <!--<PackageReference Include="Microsoft.AspNetCore.SpaServices.Extensions" Version="2.1.0" />-->
    <PackageReference Include="Microsoft.VisualStudio.Web.CodeGeneration.Design" Version="2.1.0" PrivateAssets="All" />
    <PackageReference Include="System.Reactive" Version="4.1.2" />
    <PackageReference Include="System.Reactive.Linq" Version="4.1.2" />
  </ItemGroup>

  <ItemGroup>
    <!--<ProjectReference Include="..\..\vendor\AspNet.Security.OAuth.Providers\src\AspNet.Security.OAuth.Linkedin\AspNet.Security.OAuth.LinkedIn.csproj" />-->
    <ProjectReference Include="..\..\vendor\markdig\src\Markdig\Markdig.csproj" />
    <ProjectReference Include="..\..\vendor\HtmlSanitizer\src\HtmlSanitizer\HtmlSanitizer.csproj" />
    <ProjectReference Include="..\MyProject.Core\MyProject.Core.csproj" Version="1.0.0" />
    <ProjectReference Include="..\MyProject.Data\MyProject.Data.csproj" Version="1.0.0" />
    <ProjectReference Include="..\MyProject.Api\MyProject.Api.csproj" Version="1.0.0" />
    <ProjectReference Include="..\MyProject.Identity\MyProject.Identity.csproj" Version="1.0.0" />
    <ProjectReference Include="..\MyProject.Services\MyProject.Services.csproj" Version="1.0.0" />
  </ItemGroup>

  <ItemGroup>
    <!-- Don't publish the SPA source files, but do show them in the project files list -->
    <Content Remove="$(SpaRoot)**" />
    <None Include="$(SpaRoot)**" Exclude="$(SpaRoot)node_modules\**" />
  </ItemGroup>

  <Target Name="DebugEnsureNodeEnv" BeforeTargets="Build" Condition=" '$(Configuration)' == 'Debug' And !Exists('$(SpaRoot)node_modules') ">
    <!-- Ensure Node.js is installed -->
    <Exec Command="node --version" ContinueOnError="true">
      <Output TaskParameter="ExitCode" PropertyName="ErrorCode" />
    </Exec>
    <Error Condition="'$(ErrorCode)' != '0'" Text="Node.js is required to build and run this project. To continue, please install Node.js from https://nodejs.org/, and then restart your command prompt or IDE." />
    <Message Importance="high" Text="Restoring dependencies using 'npm'. This may take several minutes..." />
    <Exec WorkingDirectory="$(SpaRoot)" Command="npm install" />
  </Target>

  <Target Name="Build Angular" Condition="'$(Configuration)'=='Release'" BeforeTargets="Build">
    <Message Text="* * * * * * Building Angular App * * * * * *" Importance="high"/>
    <Exec WorkingDirectory="$(SpaRoot)" Command="npm run build --prod"/>
  </Target> 

  <Target Name="PublishRunWebpack" AfterTargets="ComputeFilesToPublish">
    <!-- As part of publishing, ensure the JS resources are freshly built in production mode -->
    <Exec WorkingDirectory="$(SpaRoot)" Command="npm install" />
    <Exec WorkingDirectory="$(SpaRoot)" Command="npm run build -- --prod" />
    <Exec WorkingDirectory="$(SpaRoot)" Command="npm run build:ssr -- --prod" Condition=" '$(BuildServerSideRenderer)' == 'true' " />

    <!-- Include the newly-built files in the publish output -->
    <ItemGroup>
      <DistFiles Include="$(SpaRoot)dist\**; $(SpaRoot)dist-server\**" />
      <DistFiles Include="$(SpaRoot)node_modules\**" Condition="'$(BuildServerSideRenderer)' == 'true'" />
      <ResolvedFileToPublish Include="@(DistFiles->'%(FullPath)')" Exclude="@(ResolvedFileToPublish)">
        <RelativePath>%(DistFiles.Identity)</RelativePath>
        <CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
      </ResolvedFileToPublish>
    </ItemGroup>
  </Target>

</Project>

这是我package.json的脚本部分。

"scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "build:ssr": "npm run build:client-and-server-bundles && npm run webpack:server",
    "serve:ssr": "node dist/server",
    "build:client-and-server-bundles": "ng build --prod && ng run MyProject.Web:server",
    "webpack:server": "webpack --config webpack.server.config.js --progress --colors",
    "ssr": "npm run build:universal && npm run generate:prerender && npm run server",
    "ssr:debug": "ng build --aot=true --output-hashing=all --named-chunks=false --build-optimizer=true  && ng run MyProject.Web:server:dev && webpack && node server.js",
    "ssr:cw": "ng build --aot=true --output-hashing=all --named-chunks=false --build-optimizer=true --watch",
    "ssr:sw": "ng run MyProject.Web:server:dev --watch",
    "ssr:webpack": "webpack --watch",
    "ssr:server": "nodemon server.js",
    "build:server": "ng run MyProject.Web:server:production",
    "build:prod": "ng build --prod",
    "build:universal": "ng build --prod && ng run MyProject.Web:server:production && webpack --config webpack.server.config.js --progress --colors",
    "server": "node server.js",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "build:prerender": "npm run build:universal && npm run generate:prerender",
    "generate:prerender": "node prerender.js"
  },

在Azure App Service中，这是我得到的错误：

  

Microsoft.AspNetCore.NodeServices.HostingModels.NodeInvocationException：   由于以下原因，预渲染失败：错误：找不到模块   '@角度/核心'       在Function.Module._resolveFilename（module.js：538：15）       在Function.Module._load（module.js：468：25）       在Module.require（module.js：587：17）       在要求时（internal / module.js：11：18）       在Object。@ angular / core（D：\ home \ site \ wwwroot \ ClientApp \ dist \ server \ main.js：12989：18）       位于 webpack_require （D：\ home \ site \ wwwroot \ ClientApp \ dist \ server \ main.js：20：30）       在Object ../ src / app / app.server.module.ngfactory.js（D：\ home \ site \ wwwroot \ ClientApp \ dist \ server \ main.js：2724：10）       位于 webpack_require （D：\ home \ site \ wwwroot \ ClientApp \ dist \ server \ main.js：20：30）       在Object ../ src / main.server.ts（D：\ home \ site \ wwwroot \ ClientApp \ dist \ server \ main.js：12891：37）       在 webpack_require （D：\ home \ site \ wwwroot \ ClientApp \ dist \ server \ main.js：20：30）

更新

我必须将BuildServerSideRender设置为True，并且它在部署中包括node_modules，包括“ @ angular / core”。

  <PropertyGroup>
    <TargetFramework>netcoreapp2.1</TargetFramework>
    <TypeScriptCompileBlocked>true</TypeScriptCompileBlocked>
    <TypeScriptToolsVersion>Latest</TypeScriptToolsVersion>
    <IsPackable>false</IsPackable>
    <SpaRoot>ClientApp\</SpaRoot>
    <DefaultItemExcludes>$(DefaultItemExcludes);$(SpaRoot)node_modules\**</DefaultItemExcludes>

    <!-- Set this to true if you enable server-side prerendering -->
    <BuildServerSideRenderer>true</BuildServerSideRenderer>
  </PropertyGroup>

更新2

我发现通过FTP部署时出现问题，可能会丢失一些文件。我已经从Dropbox转到其他部署方式，然后再迁移到Azure DevOps。