Yearly Archive 2023-10-07

Byphunsanit

C#: static files ( Bootstrap, CSS, JavaScript, รูป )

ต้องการ upgrade ตัว Bootstrap ใน wwwroot แทนตัวเก่าที่ติดมากับ C# ที่ติดมมากับ พวก ASP.NET Core Web App (Model-View-Controller) ตอนแรกเข้าใจว่าติดตั้งจาก NuGet แต่ก็ไม่ใช่เลย พวก static files ต้องใช้วิธีอื่น

  1. ไปที่ Solution Explorer  แล้วคลิกขวาในโฟลเดอร์ที่ต้องการ ( แนะนำให้เลือก wwwroot )
  2. เลือก  Add > Client-Side Library > Add Client-Side Library
  3. หน้าต่าง “Add Client-Side Library
    • Provider เลือก source ที่จะดึงไฟล์ลงมา เช่น cdnjs
    • Library คือสิ่งที่จะติดตั้ง เช่น bootstrap
    • ตัวเลือก
      • All library files ไฟล์ทั้งหมด
      • Choose Specific files เลือกบางไฟล์
    • Target Location จะบอกว่าเก็บไฟล์ไว้ที่ไหน เช่น wwwroot/
  4. click install
  5. เปลี่ยน path ใหม่ใน view โดยเห็นใน solution explorer wwwroot/ จะเป็น path ที่ต่างจากที่เก็บไฟล์จริง ๆ ให้ดู path ใน windows explorer ตัวอย่าง
    • <link rel=”stylesheet” href=”~/bootstrap/css/bootstrap.min.css” />
    • <script src=”~/bootstrap/js/bootstrap.min.js“></script>
    • <script src=”~/jquery/jquery.min.js“></script>
  6. ทดสอบโดย run project และเปิดเว็บ
    https://localhost:{ port }/bootstrap/css/bootstrap.min.css
    เช่น
    https://localhost:7083/bootstrap/css/bootstrap.min.css

อ่านเพิ่มเติม