ค้นหาเว็บไซต์

asp.net mvc - D3 + VueJs + Typescript | วิธีการนำเข้าไลบรารี D3.js?


ฉันต้องสร้างแดชบอร์ดสำหรับลูกค้าของฉันโดยใช้ VueJS + Typescript และ D3.js

พวกเขากำลังใช้เทมเพลต dotnet vue: 'dotnet new -install Microsoft.AspNetCore.SpaTemplates::*' 'dotnet new vue'

ทุกอย่างถูกตั้งค่าบนการติดตั้ง: Webpack, Typescript และ VueJS

การตั้งค่า Webpack นี้ไม่รองรับ <script lang="ts"></script> และบทเรียนส่วนใหญ่ใช้มันในการนำเข้าไลบรารี D3.js

มีวิธีใดบ้างในการปรับแต่ง webpack ในเทมเพลตนี้เพื่อให้รองรับ <script lang="ts"></script>?

เกิดข้อผิดพลาดหลังจากที่ฉันติดตั้ง d3 และ d3 typings

ดีที่สุด

คำตอบ #1

ฉันไม่รู้ว่าทำไมคุณถึงอยากใช้ <script> แทนวิธีที่ใช้ npm ตามปกติ มีตัวอย่าง/บทเรียนมากมายบนอินเทอร์เน็ตเกี่ยวกับหัวข้อนั้น ปกติ สิ่งที่คุณทำคือไม่กี่ขั้นตอน:

  1. ติดตั้ง d3 เป็น dependency ของ npm: npm install --save d3
  2. เนื่องจากคุณกำลังเขียนโค้ดใน TypeScript การได้รับการสนับสนุนชนิดข้อมูลบางส่วนจะเป็นประโยชน์: npm install --save-dev @types/d3
  3. ในไฟล์ TypeScript ของคุณ ให้ทำการนำเข้าชนิดโดยเพิ่มบรรทัดต่อไปนี้ที่ด้านบนสุดของไฟล์: import * as d3 from "d3";
  4. ใช้มัน d3.select(...)

บทความที่เกี่ยวข้อง