목차
방법이 별로 좋지는 않지만 어쩔 수 없는 경우도 있습니다.
1. 모듈이 ES 모듈의 가져오기/내보내기 구문을 사용하는 경우.
2. 如果模块本身没有使用 imports,但源代码用到了
3. 导入 commonjs 模块
使 Typescript 类型能够正常工作
웹 프론트엔드 JS 튜토리얼 Deno에서 Node 모듈을 사용하는 방법은 무엇입니까?

Deno에서 Node 모듈을 사용하는 방법은 무엇입니까?

Sep 02, 2020 am 10:17 AM
node

Deno에서 Node 모듈을 사용하는 방법은 무엇입니까?

방법이 별로 좋지는 않지만 어쩔 수 없는 경우도 있습니다.

Deno는 웹 기술을 기반으로 한 서버사이드 코드 실행 환경입니다.

  • Node는 JavaScript 및 commonjs 모듈을 사용하고 npm/yarn을 패키지 관리자로 사용합니다. [동영상 튜토리얼 추천: node js tutorial ]
  • 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 语法即可。通过 unpkg 直接从 npm 存储库内部访问这些文件不失为一个好方法。

import throttle from https://unpkg.com/lodash@4.17.19/throttle.js
로그인 후 복사

2. 如果模块本身没有使用 imports,但源代码用到了

如果是通过 npm 编译的模块,或使用了错误格式的模块,那么是否使用其源代码可能需要一些运气。许多流行库的源代码已经从 commonjs 迁移到了符合标准的 ES 模块的 import 语法。

一些软件包有单独的 src/dist/ 目录,其中 ES 模块风格的代码位于 src/ 中,但 npm 中并未将其包含在软件包中。在这种情况下,你可以直接从源进行导入。

import throttle from "https://raw.githubusercontent.com/lodash/lodash/master/throttle.js";
로그인 후 복사

可以通过单击 github 上的 “raw” 按钮得到这个 URL,进而获取原始的 JS 文件。使用 github cdn 或查看文件是否可以通过 github 页面进行访问,这样更直接,但却是可行的。

特别注意: 一些库将 ES 模块与 webpack 一起使用,或者使用模块加载器,使它们可以从 Node 模块中导入,如下所示:

//不好的用法:
import { someFunction } from "modulename";
import { someOtherFunction } from "modulename/file.js";
로그인 후 복사

标准的导入方法是,要以 ./ 开头或者是一个可以正常工作的 URL:

//标准的用法:
import { someOtherFunction } from "./folder/file.js";
로그인 후 복사

不过你也可以尝试下一种方法:

3. 导入 commonjs 模块

幸运的是,有一个名为 JSPM 的服务,它能够解析第三方模块并对 commonjs 模块进行编译来用作 ES 模块导入。该工具可用于在浏览器中使用 Node 模块,而无需构建步骤。但是我们也可以在这里用到它。

在我最近的项目中,想进行推送通知,其中涉及生成 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 文件。有时你还可以在 @typessomemodule 存储库中找到类型定义文件。

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

通过这个文件 typescript 可以自动完成从 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;
로그인 후 복사

我从定义文件中将类型定义导入为 FastXMLParserrrreee

2. 모듈 자체는 import를 사용하지 않지만 소스 코드에서는 사용하는 경우 🎜npm을 통해 컴파일된 모듈이거나 잘못된 형식의 모듈을 사용하는 경우 소스 코드를 사용할지 여부에는 약간의 운이 필요할 수 있습니다. 많은 인기 라이브러리의 소스 코드가 commonjs에서 표준을 준수하는 ES 모듈의 import 구문으로 마이그레이션되었습니다. 🎜🎜일부 소프트웨어 패키지에는 별도의 src/dist/ 디렉터리가 있습니다. 여기서 ES 모듈 스타일 코드는 src/에 있지만 npm에 있습니다. 그것은 패키지에 포함되어 있지 않습니다. 이 경우 소스에서 직접 가져올 수 있습니다. 🎜rrreee🎜github에서 "raw" 버튼을 클릭하여 원본 JS 파일을 얻으면 이 URL을 얻을 수 있습니다. github cdn🎜을 사용하거나 더 직접적인 github 페이지를 통해 파일에 액세스할 수 있는지 확인하세요. 실행할 수 있는. 🎜🎜특별 참고 사항: 일부 라이브러리는 webpack과 함께 ES 모듈을 사용하거나 모듈 로더를 사용하여 다음과 같이 노드 모듈에서 가져올 수 있도록 만듭니다. 🎜rrreee🎜표준 가져오기 방법은 ./ 또는 작업 URL: 🎜rrreee🎜그러나 다음 방법을 시도해 볼 수도 있습니다. 🎜

3. commonjs 모듈 가져오기 🎜🎜다행히 JSPM🎜, 타사 모듈을 구문 분석하고 commonjs 모듈을 구문 분석할 수 있습니다. 모듈은 ES 모듈 가져오기로 사용하기 위해 컴파일됩니다. 이 도구는 빌드 단계 없이 브라우저에서 노드 모듈을 사용하는 데 사용할 수 있습니다. 하지만 여기서도 사용할 수 있습니다. 🎜🎜최근 프로젝트에서 VAPID에 대한 자격 증명 생성과 관련된 푸시 알림을 만들고 싶습니다. 암호화할 수 있는 deno 비밀번호 라이브러리가 있지만 전체 개발 프로세스가 어렵습니다. "https:/ /www.npmjs.com/package/web-push" rel="nofollow noreferrer" target="_blank">web-push🎜 라이브러리. JSPM CDN과 다음 URL을 사용하여 가져올 수 있습니다: 🎜rrreee🎜이 방법을 사용하면 다른 모듈처럼 deno에서 사용할 수 있습니다. 🎜

Typescript 유형이 제대로 작동하도록 활성화🎜🎜deno에서 typecipt를 사용하는 좋은 특징은 모듈에 대한 완벽한 자동 완성 기능을 쉽게 제공할 수 있다는 것입니다. 편집기의 deno 확장은 유형 정의를 알고 있는 경우 타사 모듈을 자동 완성할 수도 있습니다. 🎜🎜코드가 제대로 작동하는 데 꼭 필요한 것은 아니지만 코드를 잘 유지하는 데 도움이 될 수 있습니다. 🎜🎜fast-xml-parser🎜 모듈이라는 다른 모듈을 가져온 후 , .d.ts로 끝나는 유형 정의 파일이 있음을 확인했습니다. 이러한 파일은 다양한 인터페이스를 설명하며 JavaScript.js 파일에도 적용됩니다. 때로는 @typessomemodule 저장소에서 유형 정의 파일을 찾을 수도 있습니다. 🎜🎜예: https://github.com/Definitely. .🎜🎜🎜이 파일 형식 스크립트는 JavaScript 파일에서 가져온 콘텐츠를 자동으로 완성할 수 있습니다. 이는 JSPM으로 가져온 파일의 경우에도 마찬가지입니다. 🎜rrreee🎜 정의 파일에서 유형 정의를 FastXMLParser로 가져왔지만(대문자 F 참고) 유효한 코드가 포함되어 있지 않았지만 이 An 가져오려는 코드와 동일한 유형의 객체입니다. 🎜

JSPM에서 코드를 fastXMLParser(소문자 f)로 가져왔는데, 이는 유효한 코드이지만 유형이 없습니다. fastXMLParser(小写字母 f),这是有效的代码,但没有类型。

接下来,把它们组合在一起来创建 parser,即 FastXMLParser 类型的 fastXMLParser

다음으로 이들을 결합하여 FastXMLParser 유형의 fastXMLParserparser를 만듭니다.

마지막으로, 한 번 시도해 보시기 바랍니다deno

. 웹이나 node/npm에 사용되는 모든 모듈을 사용할 수 있는 Deno의 능력은 실제로 이 새로운 서버 측 라이브러리 생태계를 위한 좋은 기반을 마련했습니다.

더 많은 프로그래밍 관련 지식을 보려면 프로그래밍 교육
을 방문하세요! !

🎜

위 내용은 Deno에서 Node 모듈을 사용하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

핫 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 옷 제거제

Video Face Swap

Video Face Swap

완전히 무료인 AI 얼굴 교환 도구를 사용하여 모든 비디오의 얼굴을 쉽게 바꾸세요!

인기 기사

<gum> : Bubble Gum Simulator Infinity- 로얄 키를 얻고 사용하는 방법
4 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌
Nordhold : Fusion System, 설명
4 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌
Mandragora : 마녀 트리의 속삭임 - Grappling Hook 잠금 해제 방법
3 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

nvm에서 노드를 삭제하는 방법 nvm에서 노드를 삭제하는 방법 Dec 29, 2022 am 10:07 AM

nvm을 사용하여 노드를 삭제하는 방법: 1. "nvm-setup.zip"을 다운로드하여 C 드라이브에 설치합니다. 2. "nvm -v" 명령을 통해 환경 변수를 구성하고 버전 번호를 확인합니다. install" 명령 노드 설치; 4. "nvm uninstall" 명령을 통해 설치된 노드를 삭제합니다.

Express를 사용하여 노드 프로젝트에서 파일 업로드를 처리하는 방법 Express를 사용하여 노드 프로젝트에서 파일 업로드를 처리하는 방법 Mar 28, 2023 pm 07:28 PM

파일 업로드를 처리하는 방법은 무엇입니까? 다음 글에서는 Express를 사용하여 노드 프로젝트에서 파일 업로드를 처리하는 방법을 소개하겠습니다. 도움이 되길 바랍니다.

PI 노드 교육 : PI 노드 란 무엇입니까? Pi 노드를 설치하고 설정하는 방법은 무엇입니까? PI 노드 교육 : PI 노드 란 무엇입니까? Pi 노드를 설치하고 설정하는 방법은 무엇입니까? Mar 05, 2025 pm 05:57 PM

Pinetwork 노드에 대한 자세한 설명 및 설치 안내서이 기사에서는 Pinetwork Ecosystem을 자세히 소개합니다. Pi 노드, Pinetwork 생태계의 주요 역할을 수행하고 설치 및 구성을위한 전체 단계를 제공합니다. Pinetwork 블록 체인 테스트 네트워크가 출시 된 후, PI 노드는 다가오는 주요 네트워크 릴리스를 준비하여 테스트에 적극적으로 참여하는 많은 개척자들의 중요한 부분이되었습니다. 아직 Pinetwork를 모른다면 Picoin이 무엇인지 참조하십시오. 리스팅 가격은 얼마입니까? PI 사용, 광업 및 보안 분석. Pinetwork 란 무엇입니까? Pinetwork 프로젝트는 2019 년에 시작되었으며 독점적 인 Cryptocurrency Pi Coin을 소유하고 있습니다. 이 프로젝트는 모든 사람이 참여할 수있는 사람을 만드는 것을 목표로합니다.

Node 서비스의 Docker 미러링을 수행하는 방법은 무엇입니까? 극한 최적화에 대한 자세한 설명 Node 서비스의 Docker 미러링을 수행하는 방법은 무엇입니까? 극한 최적화에 대한 자세한 설명 Oct 19, 2022 pm 07:38 PM

이 기간 동안 저는 Tencent 문서의 모든 카테고리에 공통되는 HTML 동적 서비스를 개발 중입니다. 다양한 카테고리에 대한 액세스 생성 및 배포를 촉진하고 클라우드로 이동하는 추세에 부응하기 위해. Docker를 사용하여 서비스 콘텐츠를 수정하고 제품 버전을 균일하게 관리합니다. 이 글에서는 제가 Docker를 서비스하면서 쌓은 최적화 경험을 여러분의 참고용으로 공유하겠습니다.

Node의 프로세스 관리 도구 'pm2”에 대한 심층 분석 Node의 프로세스 관리 도구 'pm2”에 대한 심층 분석 Apr 03, 2023 pm 06:02 PM

이 기사에서는 Node의 프로세스 관리 도구인 "pm2"를 공유하고 pm2가 필요한 이유, pm2 설치 및 사용 방법에 대해 설명합니다. 모두에게 도움이 되기를 바랍니다!

pkg를 사용하여 Node.js 프로젝트를 실행 파일로 패키징하는 방법에 대해 이야기해 보겠습니다. pkg를 사용하여 Node.js 프로젝트를 실행 파일로 패키징하는 방법에 대해 이야기해 보겠습니다. Dec 02, 2022 pm 09:06 PM

nodejs 실행 파일을 pkg로 패키징하는 방법은 무엇입니까? 다음 기사에서는 pkg를 사용하여 Node 프로젝트를 실행 파일로 패키징하는 방법을 소개합니다. 도움이 되기를 바랍니다.

npm node gyp가 실패하는 경우 수행할 작업 npm node gyp가 실패하는 경우 수행할 작업 Dec 29, 2022 pm 02:42 PM

"node-gyp.js"와 "Node.js"의 버전이 일치하지 않아 npm node gyp가 실패했습니다. 해결 방법: 1. "npm 캐시 clean -f"를 통해 노드 캐시를 지웁니다. 2. "npm install - g n" n 모듈을 설치합니다. 3. "n v12.21.0" 명령을 통해 "node v12.21.0" 버전을 설치합니다.

Angular 및 Node를 사용한 토큰 기반 인증 Angular 및 Node를 사용한 토큰 기반 인증 Sep 01, 2023 pm 02:01 PM

인증은 모든 웹 애플리케이션에서 가장 중요한 부분 중 하나입니다. 이 튜토리얼에서는 토큰 기반 인증 시스템과 기존 로그인 시스템과의 차이점에 대해 설명합니다. 이 튜토리얼이 끝나면 Angular와 Node.js로 작성된 완벽하게 작동하는 데모를 볼 수 있습니다. 기존 인증 시스템 토큰 기반 인증 시스템으로 넘어가기 전에 기존 인증 시스템을 살펴보겠습니다. 사용자는 로그인 양식에 사용자 이름과 비밀번호를 입력하고 로그인을 클릭합니다. 요청한 후 데이터베이스를 쿼리하여 백엔드에서 사용자를 인증합니다. 요청이 유효하면 데이터베이스에서 얻은 사용자 정보를 이용하여 세션을 생성하고, 세션 정보를 응답 헤더에 반환하여 브라우저에 세션 ID를 저장한다. 다음과 같은 애플리케이션에 대한 액세스를 제공합니다.

See all articles