代码之家 › 专栏 › 技术社区 › Anjali

.net core和angular 7项目

asp.net-core angular

0

Anjali · 技术社区 · 6 年前

我对.NETCore和angular项目非常陌生。我得到的应用程序使用.NETCore和angular从表中创建添加和删除行。我在visualstudio应用程序中创建了angular项目。我没有使用visualstudio代码编辑器来创建angular项目。我测试了我的控制器创建后,它返回的数据。当我运行应用程序时,出现了一个错误

 Cannot GET /

我的项目结构如下C:\ITProjects\ProjectsDetails。我的计划在于 c: \ITProjects\projectDetails\ClientApp项目

我编译了整个应用程序并通过单击F5运行应用程序,得到了上面的错误。我是否需要运行命令ng serve来运行angular项目,或者我可以通过单击F5来运行整个visualstudio项目? 下面是我的包.json文件

{
  "name": "ProjectDetails",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve --extract-css",
    "build": "ng build --extract-css",
    "build:ssr": "npm run build -- --app=ssr --output-hashing=media",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^5.2.0",
    "@angular/common": "^5.2.0",
    "@angular/compiler": "^5.2.0",
    "@angular/core": "^5.2.0",
    "@angular/forms": "^5.2.0",
    "@angular/http": "^5.2.0",
    "@angular/platform-browser": "^5.2.0",
    "@angular/platform-browser-dynamic": "^5.2.0",
    "@angular/platform-server": "^5.2.0",
    "@angular/router": "^5.2.0",
    "@nguniversal/module-map-ngfactory-loader": "^5.0.0-beta.5",
    "aspnet-prerendering": "^3.0.1",
    "bootstrap": "^3.4.1",
    "core-js": "^2.4.1",
    "rxjs": "^5.5.6",
    "zone.js": "^0.8.19"
  },
  "devDependencies": {
    "@angular/cli": "~1.7.0",
    "@angular/compiler-cli": "^5.2.0",
    "@angular/language-service": "^5.2.0",
    "@types/jasmine": "~2.8.3",
    "@types/jasminewd2": "~2.0.2",
    "@types/node": "~6.0.60",
    "codelyzer": "^4.0.1",
    "jasmine-core": "~2.8.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~2.0.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "^1.2.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.1.2",
    "ts-node": "~4.1.0",
    "tslint": "~5.9.1",
    "typescript": "~2.5.3"
  },
  "optionalDependencies": {
    "node-sass": "^4.9.0"
  }
}

任何帮助都将不胜感激。

0 回复 | 直到 6 年前

1

Zze 6 年前

你应该在教室里看到这样的东西 MSBuild :

<Target Name="DebugRunWebpack" BeforeTargets="Build" Condition=" '$(Configuration)' == 'Debug' And !Exists('wwwroot\dist') ">
    <!-- 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." />

    <!-- In development, the dist files won't exist on the first run or when cloning to
         a different machine, so rebuild them if not already present. -->
    <Message Importance="high" Text="Performing first-run Webpack build..." />
    <Exec Command="node node_modules/webpack/bin/webpack.js --config webpack.config.vendor.js" />
    <Exec Command="node node_modules/webpack/bin/webpack.js" />
</Target>

<Target Name="PublishRunWebpack" AfterTargets="ComputeFilesToPublish">
    <!-- As part of publishing, ensure the JS resources are freshly built in production mode -->
    <Exec Command="npm install" />
    <Exec Command="node node_modules/webpack/bin/webpack.js --config webpack.config.vendor.js --env.prod" />
    <Exec Command="node node_modules/webpack/bin/webpack.js --env.prod" />

    <!-- Include the newly-built files in the publish output -->
    <ItemGroup>
      <DistFiles Include="wwwroot\dist\**; ClientApp\dist\**" />
      <ResolvedFileToPublish Include="@(DistFiles->'%(FullPath)')" Exclude="@(ResolvedFileToPublish)">
        <RelativePath>%(DistFiles.Identity)</RelativePath>
        <CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
      </ResolvedFileToPublish>
    </ItemGroup>
</Target>

这是什么将建立你的角度项目,并把它放在 wwwRoot 要部署的文件夹,这样您就不必 ng serve .

2

0

Adrian Brand 6 年前

就我个人而言,我更喜欢在开发时将角度和API项目分开。你可以使用proxy.config.json文件配置代理以解决跨域请求的文件。然后,当您想要部署时,您就有了一个脚本来构建api,然后构建Angular并将dist复制到api的wwwroot文件夹中。