前後端分離工程搭建

前端 vue-cli-service

後端 ASP.NET Core WebAPI

1. 後端搭建

1.1 新建項目：

模板：Web->ASP.NET Core Web 應用程序->.NET Framework->ASP.NET Core 2.1->API

編輯TestProject.csproj，添加GenerateDocumentationFile配置節

<PropertyGroup>
  <TargetFramework>net461</TargetFramework>
  <GenerateDocumentationFile>true</GenerateDocumentationFile>
</PropertyGroup>

1.2 配置IIS調試

編輯 Properties–>launchSetting.json文件

{
  "iisSettings": {
    "windowsAuthentication": false,
    "anonymousAuthentication": true,
    "iis": {
      "applicationUrl": "http://xxxxxx/TestProject",
      "sslPort": 0
    }
  },
  "$schema": "http://json.schemastore.org/launchsettings.json",
  "profiles": {
    "TeamCheck": {
      "commandName": "Project",
      "launchBrowser": true,
      "launchUrl": "api/values",
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Development"
      },
      "applicationUrl": "http://localhost:5000"
    },
    "IIS": {
      "commandName": "IIS",
      "launchBrowser": true,
      "launchUrl": "swagger/",
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Development"
      }
    }
  }
}

1.3 配置Swagger

詳細操作見往期博客 ASP.Net MVCWebApi下集成Swagger UI

2.前端工程

2.1 vui ui

• Base URL：/team/
• PWA App Name：teamcheck
• package.json修改name爲小寫

添加依賴

• element-ui
• axios
• moment
• lodash
• font-awesome

END