ทำงานกับบริการสปาใน. NetCore 3.0 หรือไม่

ฉันพัฒนาเว็บแอปพลิเคชัน SPA โดยใช้ ASP.Net Core React + Redux

หลังจากอัปเดตเป็น. Net Core 3.0 ฉันเห็นว่า UseWebpackDevMiddleware และ AddNodeServices ล้าสมัย

ฉันเรียนรู้เทมเพลตโครงการใหม่ React + Redux แต่ไม่ได้ใช้ webpack หรือ SSR

1) ฉันจะหาตัวอย่างหรือข้อมูลการทำงานกับ webpack ใน. Net Core 3.0 ได้ที่ไหน ด้วย UseWebpackDevMiddleware เป็นเรื่องง่ายที่จะกำหนดค่า HMR และสร้างเว็บแพค

2) ฉันจะหาตัวอย่างหรือข้อมูลเกี่ยวกับ SSR ด้วย. Net 3.0 + React ได้ที่ไหน?

— อเล็กซ์
แหล่งที่มา

ฉันรู้สึกว่าฉันอยู่ในเรือลำเดียวกันกับตัวคุณเอง !!! ต้องใช้เวลาในสัปดาห์ที่แล้วหรือประมาณนั้นตั้งแต่เปิดตัว dotnetcore3 อย่างเป็นทางการฉันพยายามทำให้บางสิ่งบางอย่างทำงานโดยใช้เฟรมเวิร์ก SPA

เนื่องจากไม่มีคำตอบสำหรับเรื่องนี้และฉันกระตือรือร้นที่จะรับบริการสปาที่ทำงานให้aspnetcore3ฉันได้ดูเทมเพลตต่างๆที่จัดมาให้ใน Visual Studio ปัจจุบันแม่แบบที่มีAngularและการใช้งานที่Reactaspnetcore3

ก่อนหน้านี้มีแม่แบบสำหรับAngular, และนอกจากนี้ยังมีReact Aureliaสำหรับฉัน Aurelia ดูดีมาก - การผูกไทวานิลลา ดังนั้นฉันจึงพยายามลงเส้นทางนั้น

ฉันจัดการเพื่อให้HMR(การเปลี่ยนโมดูลร้อน) ทำงานได้ ฉันสร้างโครงการ Aurelia โดยใช้ CLI อย่างไรก็ตามโครงการของฉันมีการกำหนดค่าจำนวนมากและฉันยังคงเรียนรู้WebPackอยู่ HMR ไม่สามารถใช้งานกับ Aurelia CSS ได้ในขณะนี้

สำหรับสถานการณ์ของฉันฉันได้โหลดแอปไคลเอ็นต์ใน VS Code แล้ว ฉันสร้างโครงการแกน aspnet ซึ่งต่อเข้ากับ webpack

ฉันรู้ว่าคุณกำลังถามอย่างเฉพาะเจาะจงเกี่ยวกับ React แต่แนวคิดอาจเหมือนกัน

บางรหัส

คุณสามารถค้นหารหัสของฉันได้ที่นี่:

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

หมายเหตุ: ปัจจุบันฉันเพิ่งจะทิ้งสิ่งของลงใน repo นี้ มีโครงการที่สร้างจากแม่แบบหากคุณนำทางไปยังระดับบนสุด

การใช้

เปิดโฟลเดอร์spa-apps\aurelia-cli\e1\aurelia-appในVSCode
เปิดproject.csprojในVS2019
เปิดเทอร์มินัลVSCodeและเรียกใช้npm start -- --hmrแล้วรอเอาต์พุตให้เสร็จสมบูรณ์
รวบรวมและเรียกใช้โซลูชันใน VS2019

สิ่งนี้ควรเปิดเบราว์เซอร์เริ่มต้นและโหลด index.ejs

สิ่งที่ควรทราบ

หมายเลขพอร์ตในโครงการ dotnet และโครงการ aurelia ต้องเชื่อมโยงกัน

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"
  },

ดังนั้นนี่อาจเป็นแนวคิดเดียวกันกับ React ด้วยเหตุผลบางอย่างเทมเพลต React ของฉันล้มเหลวในการเชื่อมต่อกับ IIS Express - และทำงานได้ในวันก่อน - ดังนั้นจึงไม่สามารถทำการขุดได้

สำหรับฉันโครงการนี้มีชิ้นส่วนที่เคลื่อนไหวมากมาย ฉันหวังว่าฉันจะมีวิธีการแก้ปัญหาการทำงานน้อยที่สุด - ซึ่งประกอบด้วย webpack + scss + กรอบสปาบางส่วน + dotnetcore3 แต่มีการกำหนดค่ามากมายและไฟล์จำนวนมาก

ลิงค์อื่น ๆ

นอกจากนี้ยังอาจคุ้มค่าที่จะตรวจสอบโพสต์บล็อกนี้:

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

อ่านเพิ่มเติมเกี่ยวกับ aurelia ที่นี่:

https://aurelia.io/

หวังว่าใครบางคนจะให้คำตอบที่ดีกว่ากับคุณ - แต่นี่อาจทำให้คุณไปได้ หวังว่า Microsoft จะอัปเดตเอกสารและตัวอย่างและให้คำแนะนำที่ดีกว่าแก่เรา

การอัปเดตเทมเพลต dotnet (เมษายน 2020)

ฉันหวังว่าแม่แบบที่ได้รับการอัปเดตอาจเอาชนะความแตกต่างของ core / core dotnet กับ webpack ดังนั้นหวังว่ามันจะเป็นกรณีของการดึงแม่แบบใหม่

ดูที่นี่:

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

— Andez
แหล่งที่มา