JavaScript 動態匯入
了解 JavaScript 的這個新功能 直到最近，我才有幸使用動態匯入，當時我在一個 Next.js 應用程式中使用它們來分割程式碼，並且我必須進行一些研究，因為它們與靜態匯入有些不同。 一個 ES 模組的靜態匯入（預設匯出）的寫法如下： import moment from 'moment' 你可以使用物件解構的方式來取得命名匯出： import { format } from 'date-fns' 靜態匯入有一些限制： 它們限制在檔案的頂層 它們不能在條件判斷（if）內被載入 套件名稱無法在執行時決定 動態匯入可以做到所有這些事情！ 它們的語法略有不同。 並且它們可以在模組內使用。 使用方式如下： const module = await import('module') 而要使用預設匯出，則必須先呼叫 .default()。 以 moment 為例的範例： const moment = (await import('moment')).default() 相反地，命名匯入的使用方式與預期相同： const { format } = await import('date-fns') 你能夠立即使用它們嗎？可以！瀏覽器支援已經相當不錯，並且還有一個Babel 插件可用。