asp.net-core
Lavorare con JavascriptServices

introduzione

Abilitazione di webpack-dev-middleware per il progetto asp.net-core

Supponiamo che tu usi Webpack per il bundle front-end. Puoi aggiungere webpack-dev-middleware per servire le tue statistiche attraverso server piccoli e veloci. Ti consente di ricaricare automaticamente le tue risorse quando il contenuto è cambiato, di servire le statiche in memoria senza scrivere continuamente versioni intermedie su disco.

Prerequisiti

NuGet

Pacchetto di installazione Microsoft.AspNetCore.SpaServices

npm

npm install --save-dev aspnet-webpack, webpack-dev-middleware, webpack-dev-server

Configurazione

Estendi il metodo Configure nella tua classe di Startup

if (env.IsDevelopment())
{
     app.UseWebpackDevMiddleware(new WebpackDevMiddlewareOptions()
     {
         ConfigFile = "webpack.config.js" //this is defualt value
     });
}

Aggiungi sostituzione modulo caldo (HMR)

La sostituzione del modulo caldo consente di aggiungere, modificare o eliminare il modulo dell'app quando l'applicazione è in esecuzione. Il ricaricamento della pagina non è necessario in questo caso.

Prerequisiti

Oltre ai pacchetti webpack-dev-middleware :

npm install --save-dev webpack-hot-middleware

Configurazione

Basta aggiornare la configurazione di UseWebpackDevMiddleware con nuove opzioni:

app.UseWebpackDevMiddleware(new WebpackDevMiddlewareOptions()
{
    ConfigFile = "webpack.config.js", //this is defualt value
    HotModuleReplacement = true,
    ReactHotModuleReplacement = true, //for React only
});

È inoltre necessario accettare i moduli hot nel codice dell'app.

HMR è supportato per Angular 2, React, Knockout e Vue.

Generazione di una singola applicazione di esempio con il nucleo di asp.net

È possibile utilizzare il generatore aspnetcore-spa per Yeoman per creare un'applicazione singola pagina nuova di zecca con asp.net core.

Ciò consente di scegliere uno dei framework front-end più diffusi e di generare progetti con webpack, server di sviluppo, sostituzione di moduli caldi e funzionalità di rendering lato server.

Corri

npm install -g yo generator-aspnetcore-spa
cd newproject
yo aspnetcore-spa

e scegli la tua struttura preferita