Bekerja dengan layanan spa di .NetCore 3.0?

9

Saya mengembangkan aplikasi web SPA menggunakan ASP.Net Core React + Redux.

Setelah memperbarui ke .Net Core 3.0 saya melihat bahwa UseWebpackDevMiddleware dan AddNodeServices sudah usang.

Saya belajar proyek-template baru React + Redux, tetapi tidak menggunakan webpack atau SSR.

1) Di mana saya dapat menemukan contoh atau informasi pekerjaan dengan webpack di .Net Core 3.0? dengan UseWebpackDevMiddleware benar-benar mudah untuk mengkonfigurasi HMR dan pembuatan webpack.

2) Di mana saya dapat menemukan contoh atau informasi tentang SSR dengan .Net 3.0 + Bereaksi?

alex
sumber

Jawaban:

4

Saya merasa berada di kapal yang sama dengan diri Anda sendiri !!! Setelah menghabiskan sekitar seminggu terakhir sejak rilis resmi dotnetcore3, saya telah mencoba untuk mendapatkan sesuatu dan menjalankan yang menggunakan kerangka SPA.

Mengingat belum ada jawaban untuk ini dan saya ingin menjalankan layanan SPA karena aspnetcore3saya telah melihat ke berbagai templat yang disediakan dalam Visual Studio. Saat ini templatnya adalah Angulardan Reactyang digunakan aspnetcore3.

Sebelum ini ada template untuk Angular, Reactdan juga Aurelia. Bagi saya, Aurelia tampak hebat - ikatan huruf vanilla. Jadi saya mencoba menyusuri rute itu.

Saya berhasil membuat HMR(Penggantian Modul Panas) berfungsi. Saya membangun proyek Aurelia menggunakan CLI. Namun, proyek saya memiliki banyak konfigurasi, dan saya masih belajar WebPack. HMR saat ini tidak bekerja dengan Aurelia CSS.

Untuk skenario saya, saya punya aplikasi klien dimuat dalam VS Code. Saya membuat proyek inti aspnet yang kemudian terhubung ke webpack.

Saya tahu Anda bertanya secara spesifik tentang React, tetapi konsepnya bisa sama.

Beberapa kode

Anda dapat menemukan kode saya di sini:

https://github.com/andez2000/spa-apps/tree/master/aurelia-cli/e1/aurelia-app

CATATAN: Saat ini saya hanya membuang barang ke repo ini. Ada proyek yang dibuat dari template jika Anda menavigasi ke tingkat atas.

Pemakaian

  1. Buka folder spa-apps\aurelia-cli\e1\aurelia-appdiVSCode
  2. Buka project.csprojinVS2019
  3. Buka terminal VSCodedan jalankan npm start -- --hmrdan tunggu output selesai.
  4. Kompilasi dan jalankan solusi di VS2019

Ini harus membuka browser default dan memuat index.ejs.

Hal-hal yang perlu diperhatikan

Nomor port dalam proyek dotnet dan proyek aurelia harus diikat.

Startup.cs

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    ...
    app.UseSpa(spa =>
    {

        if (env.IsDevelopment())
        {
            spa.UseProxyToSpaDevelopmentServer("http://localhost:5000");
        }
    });
}

aurelia.json

  "platform": {
    "hmr": false,
    "open": false,
    "port": 5000,
    "host": "localhost",
    "output": "wwwroot/dist"
  },

Jadi mungkin ini secara konseptual sama dengan Bereaksi. Untuk beberapa alasan, template React saya gagal terhubung ke IIS Express - dan itu bekerja beberapa hari yang lalu - jadi tidak benar-benar dalam posisi untuk menggali.

Bagi saya, proyek ini memiliki banyak bagian yang bergerak. Saya berharap saya punya solusi kerja minimal - yang terdiri dari webpack + scss + beberapa kerangka spa + dotnetcore3. Tetapi ada satu ton konfigurasi dan banyak file.

Tautan lain

Mungkin juga patut untuk memeriksa posting blog ini:

https://www.alexdresko.com/2019/07/09/htmlwebpackplugin-asp-net-core-3/

Baca lebih lanjut tentang aurelia di sini:

https://aurelia.io/

Semoga seseorang akan memberi Anda jawaban yang lebih baik - tetapi ini bisa membuat Anda maju. Semoga Microsoft akan memperbarui dokumen dan contoh dan memberi kami beberapa panduan yang lebih baik.

pembaruan templat dotnet (April 2020)

Saya berharap templat yang diperbarui dapat mengatasi perbedaan aspnet core / dotnet dengan webpack. Jadi berharap ini adalah kasus menarik template baru.

Lihat disini:

https://github.com/NetCoreTemplates/aurelia-spa

Andez
sumber