web-dev-qa-db-fra.com

Asp.net core 2 avec gabarit angulaire 6

Je recherche un modèle pour utiliser asp.net core 2.0 avec 6 angulaires dans une solution avec f5 hit pour exécuter l'application.

Pouvez-vous aider à trouver une telle demande?

Merci

asp.netangular6
5
Sal

J'en ai créé un, il est sur GitHub, ça pourrait être un bon point de départ mais ce n'est pas parfait, ça devrait grandir et évoluer au cours des prochains mois ...

https://github.com/JuanGarciaCarmona/AspNetCore21Ang6Template

Il existe également un article dans Code Project qui explique comment l’utiliser.

http://www.codeproject.com/Articles/1246748/Angular-within-ASP-NET-Core

J'espère que ça aide.

0
Juan

tutorial ici: Je ne voudrais pas utiliser 

Microsoft.DotNet.Web.Spa.ProjectTemplates::2.0.0-rc1-final

mais 

Microsoft.DotNet.Web.Spa.ProjectTemplates::2.0.0

Vous pouvez utiliser Angular6.

La magie est que .net core démarre la nouvelle ligne de commande elle-même et exécute le script npm.

app.UseSpa(spa =>
{
    // To learn more about options for serving an Angular SPA from ASP.NET Core,
    // see https://go.Microsoft.com/fwlink/?linkid=864501

    spa.Options.SourcePath = "ClientApp";

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

npm start est par défaut un alias pour ng serve.

J'ai un projet de travail avec Angular6 et Core 2.

Mon projet.csproj

...
<PropertyGroup>
  <TargetFramework>netcoreapp2.0</TargetFramework>
  <TypeScriptCompileBlocked>true</TypeScriptCompileBlocked>
  <TypeScriptToolsVersion>Latest</TypeScriptToolsVersion>
  <IsPackable>false</IsPackable>

  <SpaRoot>ClientApp\</SpaRoot>
</PropertyGroup>

<ItemGroup>
  <PackageReference Include="Microsoft.AspNetCore.All" Version="2.0.6" />
  <PackageReference Include="Microsoft.AspNetCore.SpaServices.Extensions" Version="2.0.0" />
</ItemGroup>
...

et Startup.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Extensions.Logging;
using Microsoft.Extensions.Options;
using Microsoft.AspNetCore.SpaServices.AngularCli;


namespace AngularSPA
{
    public class Startup
    {
        public Startup(IConfiguration configuration)
        {
            Configuration = configuration;
        }

        public IConfiguration Configuration { get; }

        // This method gets called by the runtime. Use this method to add services to the container.
        public void ConfigureServices(IServiceCollection services)
        {
            services.AddMvc();

            // In production, the Angular files will be served from this directory
            services.AddSpaStaticFiles(configuration =>
            {
                configuration.RootPath = "ClientApp/dist";
            });
        }

        // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
        public void Configure(IApplicationBuilder app, IHostingEnvironment env)
        {
            if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
            }
            else
            {
                app.UseExceptionHandler("/Home/Error");
            }

            app.UseStaticFiles();
            app.UseSpaStaticFiles();

            app.UseMvc(routes =>
            {
                routes.MapRoute(
                    name: "default",
                    template: "{controller}/{action=Index}/{id?}");
            });

            app.UseSpa(spa =>
            {
                spa.Options.SourcePath = "ClientApp";

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

 enter image description here

Mais je n'ai qu'un problème esthétique avec la ligne de commande intégrée, vous pouvez voir ma question ici .

2
Luboš Zápotočný