検索
ホームページウェブフロントエンドjsチュートリアルDenoでNodeモジュールを使用するにはどうすればよいですか?

DenoでNodeモジュールを使用するにはどうすればよいですか?

方法はあまり良くありませんが、やむを得ない場合もあります。

Deno は、Web テクノロジーに基づいたサーバー側のコード実行環境です。

  • Node は JavaScript と commonjs モジュールを使用し、パッケージ マネージャーとして npm/yarn を使用します。 [ビデオチュートリアルの推奨: node js チュートリアル]
  • Deno は、Typescript または JavaScript に加えて、最新の JavaScript import ステートメントを使用します。パッケージマネージャーは必要ありません。

deno にモジュールをインポートしたい場合は、URL を通じて参照する必要があります:

import { serve } from "https://deno.land/std/http/server.ts";

これは Deno 標準ライブラリ にあります。または Deno サードパーティ モジュール リスト でさらに必要なモジュールを見つけることができますが、必要なすべてをカバーしているわけではありません。 npm エコシステムに依存するモジュールのみを使用できる場合があります。以下に、最も便利な方法から最も面倒な方法までいくつかの方法を示します:

1. モジュールが ES モジュールのインポート/エクスポート構文を使用する場合。

deno で使用するライブラリは、推奨される Deno パッケージから取得する必要はありません。import 構文を使用する限り、任意の URL から取得できます。 npm リポジトリ内からこれらのファイルに直接アクセスするには、unpkg を使用するのが良い方法です。

import throttle from https://unpkg.com/lodash@4.17.19/throttle.js

2. モジュール自体はインポートを使用しないが、ソース コードはインポートを使用する場合

npm でコンパイルされたモジュールである場合、または間違った形式のモジュールが使用されている場合、ソースコードを使用するには、ある程度の運が必要になる場合があります。多くの人気のあるライブラリのソース コードは、標準準拠の ES モジュールの import 構文に準拠するために commonjs から移行されました。

一部のソフトウェア パッケージには、個別の src/ および dist/ ディレクトリがあり、ES モジュール スタイルのコードは src/ にありますが、npm にはありません。パッケージには含まれておりません。この場合、ソースから直接インポートできます。

import throttle from "https://raw.githubusercontent.com/lodash/lodash/master/throttle.js";

github の「raw」ボタンをクリックしてこの URL を取得し、元の JS ファイルを取得します。 github cdn を使用するか、github ページ経由でファイルにアクセスできるかどうかを確認する方が簡単ですが実行可能です。

特記事項: 一部のライブラリは、Webpack で ES モジュールを使用するか、次のようにノード モジュールからインポートできるようにモジュール ローダーを使用します:

//不好的用法:
import { someFunction } from "modulename";
import { someOtherFunction } from "modulename/file.js";

標準import メソッドは、./ または適切に機能する URL で始まることです:

//标准的用法:
import { someOtherFunction } from "./folder/file.js";

ただし、次の方法を試すこともできます:

3. commonjs モジュールをインポートします。

幸いなことに、JSPM というサービスがあり、サードパーティのモジュールを解析し、ES モジュールのインポートとして使用する commonjs モジュールをコンパイルできます。このツールを使用すると、ビルド手順なしでブラウザーでノード モジュールを使用できます。しかし、ここでもそれを使うことができます。

最近のプロジェクトでは、VAPID の資格情報の生成を伴うプッシュ通知を実行したいと考えています。暗号化できる deno パスワード ライブラリがありますが、開発プロセス全体が困難です。むしろ、一般的なパスワード ライブラリを使用したいと考えています。 web -push ライブラリ。 JSPM CDN と次の URL を使用してインポートできます:

import webPush from "https://dev.jspm.io/web-push";

この方法で、他のモジュールと同様に deno で使用できます。

Typescript 型を適切に機能させる

deno で typecipt を使用する優れた機能は、モジュールに完璧なオートコンプリート機能を簡単に提供できることです。エディターの deno 拡張機能は、型定義がわかっていれば、サードパーティ モジュールをオートコンプリートすることもできます。

これはコードが適切に動作するために必要なわけではありませんが、コードを適切に保守するのに役立ちます。

fast-xml-parser という名前の別のモジュールをインポートしたときに、.d.ts で終わる型定義ファイルがあることに気付きました。これらのファイルはさまざまなインターフェイスを記述しており、JavaScript.js ファイルにも適用されます。場合によっては、@types\somemodule リポジトリでタイプ定義ファイルを見つけることもできます。

例: https://github.com/Definitely...

このファイル タイプ スクリプトは、JavaScript ファイルからインポートされたコンテンツを自動的に完成させることができます。これは、JSPM でインポートされたファイルにも当てはまります:

// 导入 fast-xml-parser 库
import fastXMLParser from "https://dev.jspm.io/fast-xml-parser";
// 从 fast-xml-parser 的源代码导入类型定义文件
import * as FastXMLParser from "https://raw.githubusercontent.com/NaturalIntelligence/fast-xml-parser/master/src/parser.d.ts";
//将 parser 与以下类型一起使用
const parser = fastXMLParser as typeof FastXMLParser;

定義ファイルから型定義を FastXMLParser (大文字の F に注意) としてインポートしましたが、これには有効なコードが含まれていません。これは、インポートしているコードと同じタイプのオブジェクトです。

JSPM からコードを fastXMLParser (小文字の f) としてインポートしました。これは有効なコードですが、型がありません。

次に、これらを組み合わせて parser (タイプ FastXMLParserfastXMLParser) を作成します。

最後に、ぜひ試していただければ幸いですdeno。 Web 用の任意のモジュール、さらには node/npm 用のモジュールを使用できる Deno の機能は、実際に、この新しいサーバーサイド ライブラリ エコシステムの優れた基盤を築きました。

プログラミング関連の知識について詳しくは、プログラミング教育をご覧ください。 !

以上がDenoでNodeモジュールを使用するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明
この記事はsegmentfaultで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。
C/CからJavaScriptへ:すべてがどのように機能するかC/CからJavaScriptへ:すべてがどのように機能するかApr 14, 2025 am 12:05 AM

C/CからJavaScriptへのシフトには、動的なタイピング、ゴミ収集、非同期プログラミングへの適応が必要です。 1)C/Cは、手動メモリ管理を必要とする静的に型付けられた言語であり、JavaScriptは動的に型付けされ、ごみ収集が自動的に処理されます。 2)C/Cはマシンコードにコンパイルする必要がありますが、JavaScriptは解釈言語です。 3)JavaScriptは、閉鎖、プロトタイプチェーン、約束などの概念を導入します。これにより、柔軟性と非同期プログラミング機能が向上します。

JavaScriptエンジン:実装の比較JavaScriptエンジン:実装の比較Apr 13, 2025 am 12:05 AM

さまざまなJavaScriptエンジンは、各エンジンの実装原則と最適化戦略が異なるため、JavaScriptコードを解析および実行するときに異なる効果をもたらします。 1。語彙分析:ソースコードを語彙ユニットに変換します。 2。文法分析:抽象的な構文ツリーを生成します。 3。最適化とコンパイル:JITコンパイラを介してマシンコードを生成します。 4。実行:マシンコードを実行します。 V8エンジンはインスタントコンピレーションと非表示クラスを通じて最適化され、Spidermonkeyはタイプ推論システムを使用して、同じコードで異なるパフォーマンスパフォーマンスをもたらします。

ブラウザを超えて:現実世界のJavaScriptブラウザを超えて:現実世界のJavaScriptApr 12, 2025 am 12:06 AM

現実世界におけるJavaScriptのアプリケーションには、サーバー側のプログラミング、モバイルアプリケーション開発、モノのインターネット制御が含まれます。 2。モバイルアプリケーションの開発は、ReactNativeを通じて実行され、クロスプラットフォームの展開をサポートします。 3.ハードウェアの相互作用に適したJohnny-Fiveライブラリを介したIoTデバイス制御に使用されます。

next.jsを使用してマルチテナントSaaSアプリケーションを構築する(バックエンド統合)next.jsを使用してマルチテナントSaaSアプリケーションを構築する(バックエンド統合)Apr 11, 2025 am 08:23 AM

私はあなたの日常的な技術ツールを使用して機能的なマルチテナントSaaSアプリケーション(EDTECHアプリ)を作成しましたが、あなたは同じことをすることができます。 まず、マルチテナントSaaSアプリケーションとは何ですか? マルチテナントSaaSアプリケーションを使用すると、Singの複数の顧客にサービスを提供できます

next.jsを使用してマルチテナントSaaSアプリケーションを構築する方法(フロントエンド統合)next.jsを使用してマルチテナントSaaSアプリケーションを構築する方法(フロントエンド統合)Apr 11, 2025 am 08:22 AM

この記事では、許可によって保護されたバックエンドとのフロントエンド統合を示し、next.jsを使用して機能的なedtech SaaSアプリケーションを構築します。 FrontEndはユーザーのアクセス許可を取得してUIの可視性を制御し、APIリクエストがロールベースに付着することを保証します

JavaScript:Web言語の汎用性の調査JavaScript:Web言語の汎用性の調査Apr 11, 2025 am 12:01 AM

JavaScriptは、現代のWeb開発のコア言語であり、その多様性と柔軟性に広く使用されています。 1)フロントエンド開発:DOM操作と最新のフレームワーク(React、Vue.JS、Angularなど)を通じて、動的なWebページとシングルページアプリケーションを構築します。 2)サーバー側の開発:node.jsは、非ブロッキングI/Oモデルを使用して、高い並行性とリアルタイムアプリケーションを処理します。 3)モバイルおよびデスクトップアプリケーション開発:クロスプラットフォーム開発は、反応および電子を通じて実現され、開発効率を向上させます。

JavaScriptの進化:現在の傾向と将来の見通しJavaScriptの進化:現在の傾向と将来の見通しApr 10, 2025 am 09:33 AM

JavaScriptの最新トレンドには、TypeScriptの台頭、最新のフレームワークとライブラリの人気、WebAssemblyの適用が含まれます。将来の見通しは、より強力なタイプシステム、サーバー側のJavaScriptの開発、人工知能と機械学習の拡大、およびIoTおよびEDGEコンピューティングの可能性をカバーしています。

javascriptの分解:それが何をするのか、なぜそれが重要なのかjavascriptの分解:それが何をするのか、なぜそれが重要なのかApr 09, 2025 am 12:07 AM

JavaScriptは現代のWeb開発の基礎であり、その主な機能には、イベント駆動型のプログラミング、動的コンテンツ生成、非同期プログラミングが含まれます。 1)イベント駆動型プログラミングにより、Webページはユーザー操作に応じて動的に変更できます。 2)動的コンテンツ生成により、条件に応じてページコンテンツを調整できます。 3)非同期プログラミングにより、ユーザーインターフェイスがブロックされないようにします。 JavaScriptは、Webインタラクション、シングルページアプリケーション、サーバー側の開発で広く使用されており、ユーザーエクスペリエンスとクロスプラットフォーム開発の柔軟性を大幅に改善しています。

See all articles

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

強力な PHP 統合開発環境

Dreamweaver Mac版

Dreamweaver Mac版

ビジュアル Web 開発ツール

SecLists

SecLists

SecLists は、セキュリティ テスターの究極の相棒です。これは、セキュリティ評価中に頻繁に使用されるさまざまな種類のリストを 1 か所にまとめたものです。 SecLists は、セキュリティ テスターが必要とする可能性のあるすべてのリストを便利に提供することで、セキュリティ テストをより効率的かつ生産的にするのに役立ちます。リストの種類には、ユーザー名、パスワード、URL、ファジング ペイロード、機密データ パターン、Web シェルなどが含まれます。テスターはこのリポジトリを新しいテスト マシンにプルするだけで、必要なあらゆる種類のリストにアクセスできるようになります。

VSCode Windows 64 ビットのダウンロード

VSCode Windows 64 ビットのダウンロード

Microsoft によって発売された無料で強力な IDE エディター

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール