目錄
關鍵要點
Node.js模塊
Deno模塊
不可靠的URL
模塊版本控制
多個模塊提及
調查完整性
使用Node.js模塊
更多模塊問題
您應該切換到Deno嗎?
Deno基礎
關於Deno模塊的常見問題
首頁 web前端 js教程 DENO模塊:用法,最佳實踐和節點模塊導入

DENO模塊:用法,最佳實踐和節點模塊導入

Feb 12, 2025 am 08:33 AM

Deno Modules: Usage, Best Practices & Node Module Imports

深入了解Deno模塊——如果您來自Node.js,這將是您遇到的最大工作流程變化。了解它們的工作原理以及最佳使用方法,如何在Deno中使用Node.js模塊和npm包等等。

Node.js是一個基於Chrome V8引擎的JavaScript運行時,由Ryan Dahl開發,於2009年發布。

Deno也是一個基於Chrome V8引擎的JavaScript運行時,由Ryan Dahl開發,於2020年發布。它是在十年的經驗積累的基礎上創建的。這並不一定意味著它是Node.js的續集或更高級的替代品,但它確實偏離了Node.js的路徑。

另見:

  • 我們的Deno指南,包括我們的Deno內容索引(滾動到結尾)
  • Node.js與Deno的比較,以及選擇適合特定情況的工具指南

主要區別:Deno原生支持TypeScript、安全性、測試和瀏覽器API。模塊處理受到的關注較少,但它可能是創建JavaScript應用程序方式的最大變化。在討論Deno之前,讓我帶您回到一個更簡單的時代……

關鍵要點

  • Deno是一個基於Chrome V8引擎的JavaScript運行時,它通過原生支持TypeScript、安全性、測試和瀏覽器API而偏離了Node.js。它還選擇使用ES2015模塊,這些模塊從絕對或相對URL導入,這與使用CommonJS的Node.js不同。
  • Deno沒有像Node.js中的npm那樣的包管理器。相反,它在腳本中第一次遇到模塊的URL時,就會下載並將其緩存到全局目錄中,這意味著無論有多少項目引用它,只需要一個特定模塊版本的副本。
  • Deno允許對模塊URL進行版本控制,以便可以引用特定的代碼版本。它還支持使用單個依賴項文件導入項目中使用的每個模塊,或者使用導入映射將名稱分配給完整或部分URL。
  • 該平台具有內置安全性,限製文件系統和網絡訪問,並提供完整性檢查選項。它還支持使用Node.js API和跨平台模塊,這些模塊無需特殊處理即可在Node.js和Deno上運行,並且隨著JavaScript運行時生態系統的不斷發展,這類模塊可能會變得越來越普遍。

Node.js模塊

2009年,JavaScript沒有標準的模塊系統。部分原因是它的瀏覽器背景,ES6/ES2015還要幾年時間才會出現。

Node.js如果不提供模塊是不可想像的,因此它從社區的幾種變通方案中採用了CommonJS。這導致了Node包管理器(npm)的開發,它允許開發人員輕鬆搜索、使用和發布他們自己的JavaScript模塊。

npm的使用呈指數級增長。它已成為有史以來最流行的包管理器,到2020年中期,它託管了近150萬個模塊,每天新增超過800個(來源:modulecounts.com)。

Deno模塊

Deno選擇使用ES2015模塊,您可以從絕對或相對URL導入這些模塊:

<code>import { something } from 'https://somewhere.com/somehow.js';
</code>
登入後複製
登入後複製
登入後複製

該URL處的腳本必須相應地導出函數或其他值,例如:

<code>export function something() {
  console.log('something was executed');
}
</code>
登入後複製
登入後複製
登入後複製

Deno使用與現代Web瀏覽器中實現的相同的模塊系統。

Node.js也支持ES2015模塊……但這很複雜,並且仍然是實驗性的。 CommonJS和ES2015模塊看起來相似,但工作方式不同:

  • CommonJS在執行代碼時按需從文件系統加載依賴項。
  • ES模塊在執行代碼之前,會預先從URL解析以解析進一步的導入。

Node.js必須繼續支持CommonJS,並處理混合的ES模塊。因此,它假定:

  1. 以.cjs結尾的文件使用CommonJS
  2. 以.mjs結尾的文件使用ES模塊
  3. 以.js結尾的文件是CommonJS,除非最近的package.json設置了"type": "module",或者node是用--input-type=module選項執行的。

可以理解為什麼Deno選擇單一的標準模塊系統。但是,npm是Node成功的重要因素,因此令人驚訝的是Deno取消了它。

沒有包管理器。

對npm的一個批評是每個項目node_modules目錄的龐大規模。隨著模塊需要其他模塊的特定版本,它的大小可能達到數百兆字節。

Deno Modules: Usage, Best Practices & Node Module Imports

Deno在腳本中第一次遇到模塊的URL時,就會下載並將其緩存到全局目錄中。因此,無論有多少項目引用它,只需要一個特定模塊版本的副本。

我知道你在想:“啊,但是如果……”

……但是Deno有解決模塊URL提出的問題的選項。

不可靠的URL

URL可能會暫時失敗、更改或永久消失。這對任何包管理器來說都是一個問題,npm過去也遇到過問題(它也允許從URL安裝)。

對於關鍵的Node.js應用程序,建議將您的node_modules目錄添加到項目的Git/其他存儲庫中。

Deno支持類似的選項。您可以將DENO_DIR環境變量設置為當前項目中的目錄路徑,例如:

<code>DENO_DIR=~/myproject/deno_modules`
</code>
登入後複製
登入後複製

在Windows cmd中使用:

<code>> set DENO_DIR="C:\myproject\deno_modules"
</code>
登入後複製
登入後複製

或Windows Powershell:

<code>> $env:DENO_DIR="C:\myproject\deno_modules"
</code>
登入後複製
登入後複製

當您的應用程序運行時,Deno會將模塊緩存到該目錄中,以便可以將它們添加到項目的源代碼控制存儲庫中。

您還可以考慮將依賴項捆綁到單個JavaScript或TypeScript文件中。 Deno bundle命令可以一步完成此操作:

<code>deno bundle myscript.js myscript.bundle.js</code>
登入後複製
登入後複製

其中myscript.js是通常使用deno run執行的入口腳本。生成的獨立myscript.bundle.js文件可以部署到實時服務器。

使用頂級await進行捆綁

Deno支持頂級await:無需將await調用包裝在匿名async函數中。不幸的是,頂級await在捆綁中失敗,因此必須添加包裝函數。這是一個已知問題,將在未來的版本中修復。

最後:警惕不尋常URL上的隨機Deno模塊! 具有良好文檔和社區輸入的Deno、Github或Bitbucket URL通常更安全。

模塊版本控制

理想情況下,模塊URL應該進行版本控制,以便您可以引用特定的代碼版本。例如,Deno標準庫允許您加載HTTP服務器模塊的特定版本:

<code>import { something } from 'https://somewhere.com/somehow.js';
</code>
登入後複製
登入後複製
登入後複製

也可以引用master分支:

<code>export function something() {
  console.log('something was executed');
}
</code>
登入後複製
登入後複製
登入後複製

但這會下載最新版本,未來的版本可能與您的應用程序不兼容。

可以使用類似的版本控制約定在您自己的服務器上發布Deno模塊,但是隨著它的流行,您的網站可能會收到大量流量。更可靠的方法是使用GitHub等服務的存儲庫,並為每個版本分配一個git標籤。 denopkg.com和unpkg.com等服務可用於提供公開版本化的模塊URL。

多個模塊提及

您可能需要在應用程序代碼庫中的許多文件中引用相同的模塊URL。當您想要更新該模塊時,需要在多個地方更改URL。搜索和替換可以工作,但它笨拙、容易出錯,並增加了合併衝突的可能性。

或者,您可以使用單個依賴項文件,該文件導入項目中使用的每個模塊。它通常命名為deps.js或deps.ts:

<code>DENO_DIR=~/myproject/deno_modules`
</code>
登入後複製
登入後複製

然後,您可以在任何其他項目文件中從deps.js引用Deno模塊:

<code>> set DENO_DIR="C:\myproject\deno_modules"
</code>
登入後複製
登入後複製

當模塊更新時,您只需要更改deps.js中的單個URL引用。

另一種選擇是導入映射。這是一個小的JSON文件,通常命名為import_map.json,它將名稱分配給完整或部分URL:

<code>> $env:DENO_DIR="C:\myproject\deno_modules"
</code>
登入後複製
登入後複製

您可以在任何腳本中引用導入映射名稱:

<code>deno bundle myscript.js myscript.bundle.js</code>
登入後複製
登入後複製

然後,使用deno run執行應用程序時,導入JSON文件:

<code>import { serve } from 'https://deno.land/std@0.61.0/http/server.ts';
</code>
登入後複製

導入映射目前是一個不穩定的功能,因此需要--unstable標誌。該功能可能會在未來的Deno版本中發生變化。

調查完整性

從URL引用的代碼可能會在您不知情的情況下被更改或被黑客入侵。知名網站已被入侵,因為它們直接鏈接到第三方客戶端代碼。想像一下,如果腳本可以訪問服務器資源,它會造成多大的損害。

Deno具有內置安全性,因此腳本必須使用--allow-read和--allow-net等標誌執行,以限製文件系統和網絡訪問。這將有助於防止一些問題,但這不能替代驗證模塊完整性!

Deno提供了一個完整性檢查選項。如果您使用單個依賴項文件(如上所述),則最容易:

<code>import { serve } from 'https://deno.land/std/http/server.ts';
</code>
登入後複製

以下deno命令生成一個lock.json文件,其中包含所有導入的Deno模塊的校驗和:

<code>import { something } from 'https://somewhere.com/somehow.js';
</code>
登入後複製
登入後複製
登入後複製

當另一個開發人員克隆您的項目時,他們可以重新加載每個模塊並驗證每個模塊的完整性,以保證它們與您的模塊相同:

<code>export function something() {
  console.log('something was executed');
}
</code>
登入後複製
登入後複製
登入後複製

Deno不強制執行完整性檢查。最好將這些過程作為自動化的Git鉤子或類似操作來運行。

使用Node.js模塊

許多Node.js API都已為Deno複製——參見deno.land/std/node。這不是一個完整的列表,但您會發現常見的文件、事件、緩衝區和實用程序模塊。

deno.land/x上提供了近800個第三方Deno模塊的集合。有類似Express.js的框架、數據庫驅動程序、加密函數、命令行工具等等。

您還會發現流行模塊的精選列表,例如Awesome Deno。

但是,您可能能夠導入150萬個Node.js模塊中的任何一個。幾個CDN可以將npm/CommonJS包轉換為ES2015模塊URL,包括:

  • Skypack.dev
  • jspm.org
  • unpkg.com (在URL中添加?module查詢字符串)

您需要的模塊是否能在Deno中正常工作是另一回事。

幸運的是,無需特殊處理即可在Node.js和Deno上運行的跨平台模塊可能會隨著JavaScript運行時生態系統的不斷發展而出現。

更多模塊問題

引用模塊URL是有爭議的,對於那些來自非常流行的npm的人來說,這可能會令人不安。也就是說,Deno簡化了JavaScript模塊的使用。它解決了幾個npm的批評,同時減輕了ES2015模塊的許多潛在副作用。

但這遠非完美。

發布npm模塊很容易,搜索npmjs.com也很簡單。您的搜索詞可能會返回500個結果,但通過按流行度、質量和維護因素對包進行排名,可以最大限度地減少選擇癱瘓。

將代碼提交到Deno的第三方模塊列表比較困難。模塊必須通過自動化測試,但不能保證質量,搜索結果按字母順序排列。一旦模塊數量達到幾千個,現有的系統就不太可能持續下去。

在npm中更新包也很容易。您可以運行npm outdated查看更新列表,或者在package.json中引用較寬鬆的版本號時,只需運行npm install。

Deno中沒有等效的更新檢查選項。有可用的類似包管理器的項目,包括Trex、Update Deno Dependencies和deno-check-updates,但這些項目通常依賴於導入映射,並且始終依賴於語義版本化的URL。

您應該切換到Deno嗎?

Node.js並沒有消亡。它已經成熟,並且擁有十年的模塊、技術、文檔和運行時經驗。

Deno利用了這些知識中的大部分,但它非常新,並且在未來幾年會快速發展。對於大型應用程序來說,現在可能還為時過早,但對於小型項目來說,風險較小。那些已經使用TypeScript或來自其他語言的人可能會享受更輕鬆的體驗,但Node.js開發人員不會有任何困難來轉換到Deno然後再轉換回來。

但是,Deno有一個有趣的優勢:

  • 它的模塊系統與客戶端JavaScript相同
  • 它正在實現許多瀏覽器API:您可以引用window對象、設置事件偵聽器、啟動Web Workers、使用Fetch() API發出遠程服務器請求等等。

在客戶端或服務器上都能工作的同構JavaScript庫的夢想向前邁進了一大步。

Deno基礎

快速了解Deno。我們的Deno基礎集合幫助您邁出進入Deno世界及其他領域的第一步,並且我們不斷地向其中添加內容。我們將為您提供成為專業人士所需的教程。您始終可以在我們的Deno入門指南結尾處更新索引:

➤ Deno基礎

關於Deno模塊的常見問題

什麼是Deno模塊? Deno模塊是Deno中的代碼單元,Deno是JavaScript和TypeScript的安全運行時。 Deno中的模塊類似於Node.js中的CommonJS模塊和現代JavaScript中的ES6模塊。它們使開發人員能夠通過將代碼分解成可重用和封裝的塊來組織和共享代碼。

如何在Deno中創建模塊?在Deno中創建模塊很簡單。您可以創建一個新文件(例如,module.ts),定義您的函數或類,然後使用export關鍵字導出它們。其他Deno腳本可以導入和使用這些模塊。

如何在Deno中導入模塊?要在Deno中導入模塊,您可以使用import關鍵字後跟模塊的路徑或URL。 Deno支持本地和遠程導入。

我可以在Deno中使用第三方模塊嗎?是的,Deno支持直接從URL導入模塊,允許您使用託管在包註冊表或GitHub存儲庫上的第三方模塊。

以上是DENO模塊:用法,最佳實踐和節點模塊導入的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

熱門話題

Java教學
1654
14
CakePHP 教程
1413
52
Laravel 教程
1306
25
PHP教程
1252
29
C# 教程
1225
24
前端熱敏紙小票打印遇到亂碼問題怎麼辦? 前端熱敏紙小票打印遇到亂碼問題怎麼辦? Apr 04, 2025 pm 02:42 PM

前端熱敏紙小票打印的常見問題與解決方案在前端開發中,小票打印是一個常見的需求。然而,很多開發者在實...

神秘的JavaScript:它的作用以及為什麼重要 神秘的JavaScript:它的作用以及為什麼重要 Apr 09, 2025 am 12:07 AM

JavaScript是現代Web開發的基石,它的主要功能包括事件驅動編程、動態內容生成和異步編程。 1)事件驅動編程允許網頁根據用戶操作動態變化。 2)動態內容生成使得頁面內容可以根據條件調整。 3)異步編程確保用戶界面不被阻塞。 JavaScript廣泛應用於網頁交互、單頁面應用和服務器端開發,極大地提升了用戶體驗和跨平台開發的靈活性。

誰得到更多的Python或JavaScript? 誰得到更多的Python或JavaScript? Apr 04, 2025 am 12:09 AM

Python和JavaScript開發者的薪資沒有絕對的高低,具體取決於技能和行業需求。 1.Python在數據科學和機器學習領域可能薪資更高。 2.JavaScript在前端和全棧開發中需求大,薪資也可觀。 3.影響因素包括經驗、地理位置、公司規模和特定技能。

如何實現視差滾動和元素動畫效果,像資生堂官網那樣?
或者:
怎樣才能像資生堂官網一樣,實現頁面滾動伴隨的動畫效果? 如何實現視差滾動和元素動畫效果,像資生堂官網那樣? 或者: 怎樣才能像資生堂官網一樣,實現頁面滾動伴隨的動畫效果? Apr 04, 2025 pm 05:36 PM

實現視差滾動和元素動畫效果的探討本文將探討如何實現類似資生堂官網(https://www.shiseido.co.jp/sb/wonderland/)中�...

JavaScript的演變:當前的趨勢和未來前景 JavaScript的演變:當前的趨勢和未來前景 Apr 10, 2025 am 09:33 AM

JavaScript的最新趨勢包括TypeScript的崛起、現代框架和庫的流行以及WebAssembly的應用。未來前景涵蓋更強大的類型系統、服務器端JavaScript的發展、人工智能和機器學習的擴展以及物聯網和邊緣計算的潛力。

如何使用JavaScript將具有相同ID的數組元素合併到一個對像中? 如何使用JavaScript將具有相同ID的數組元素合併到一個對像中? Apr 04, 2025 pm 05:09 PM

如何在JavaScript中將具有相同ID的數組元素合併到一個對像中?在處理數據時,我們常常會遇到需要將具有相同ID�...

前端開發中如何實現類似 VSCode 的面板拖拽調整功能? 前端開發中如何實現類似 VSCode 的面板拖拽調整功能? Apr 04, 2025 pm 02:06 PM

探索前端中類似VSCode的面板拖拽調整功能的實現在前端開發中,如何實現類似於VSCode...

JavaScript引擎:比較實施 JavaScript引擎:比較實施 Apr 13, 2025 am 12:05 AM

不同JavaScript引擎在解析和執行JavaScript代碼時,效果會有所不同,因為每個引擎的實現原理和優化策略各有差異。 1.詞法分析:將源碼轉換為詞法單元。 2.語法分析:生成抽象語法樹。 3.優化和編譯:通過JIT編譯器生成機器碼。 4.執行:運行機器碼。 V8引擎通過即時編譯和隱藏類優化,SpiderMonkey使用類型推斷系統,導致在相同代碼上的性能表現不同。

See all articles