使用 npm 導入 date-fns

Question

我是 Web 開發新手，正在學習一個只有 1 年歷史的 JS 教程，但使用過時的說明來導入帶有 CDN 的 JS 庫 date-fns。 我喜歡 CDN，不幸的是，現在只有一個 npm 包可用（鏈接到文檔）。

我確保 npm 已更新，然后在終端中使用以下行將 date-fns 安裝到所需目錄：

npm install date-fns --save

除了這個例子之外，沒有更多關於如何使用包的說明，我假設它在 JS 文件中而不是在 html 中：

import { formatDistance, subDays } from 'date-fns'

...但使用此語法嘗試從包中導入 isToday 方法會在我的 Chrome 控制台中給出以下警告：

Uncaught SyntaxError: Cannot use import statement outside a module

這個問題在別處被問到，但這些答案中有太多與 npm 相關的術語，我不知道我應該做什么。 此外，代碼不同且更舊。 “模塊”是指 npm 包嗎？

人們希望一年前的教程足夠新，可以遵循。 唉，耳屎。

Answer 1

您可以在此處獲取date-fns的 CDN 構建： https : date-fns

import / export本機無法在瀏覽器中工作，尤其是當您嘗試使用 npm 包時。 由於您是初學者，我不想讓您感到困惑，但import / export在特定場景中有效。 您可以在此處閱讀更多相關信息： https : //developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules

一旦你熟悉了 web dev，你可以嘗試使用一個打包器，比如 Parcel，它允許你使用 npm 包並將它們組合成一個可以在 web 中使用的單個 JS 文件： https : //parceljs.org/