Deno 是一个新型的 JavaScript/TypeScript 运行时，它提供了一种安全的方式去运行某些特殊用途的脚本。Deno 对于前端开发人员来说是一个非常重要的工具，但是在使用 Deno 时，我们可能会遇到它无法找到 npm 包的问题。在本文中，我们将深入了解这个问题，并提供一些解决方案和最佳实践。
导致 Deno 无法找到 npm 包的原因
Deno 使用 import 声明依赖项，类似于 Node.js 中的 require。但是它们之间有一个非常重要的区别：Deno 不支持 npm。具体来说，这意味着当我们试图在 Deno 中导入一个 npm 包时，它会失败，并显示类似于“Cannot resolve module 'xxx'”的错误消息。
这是因为 Deno 使用的模块解析方法与 Node.js 不同。在 Node.js 中，有一个叫做“node_modules”的文件夹，所有的 npm 包都被安装在这个文件夹下，通过 require 引入时会沿着目录树向上查找直到找到该模块。但是，在 Deno 中，没有像 node_modules 这样的文件夹，它使用了不同的模块解析方案。Deno 需要在运行时解析从不同位置导入模块的路径。
解决 Deno 无法找到 npm 包的问题的方法
1. 使用 URL
如果要在 Deno 中使用 npm 包，可以通过 URL 导入。许多 npm 包都可以通过 CDN 或直接从 GitHub 下载到相应的 URL。例如：
import * as React from "https://esm.sh/react";
这种方法通常是最简单的，特别是对于一些流行的 npm 包，这些 URL 可能已经存在于网络上。然而，使用 URL 也有一些缺点，如依赖包版本控制、依赖关系解决和安全性等问题。
2. 使用 DENO_DIR（DENO 配置目录）
DENO_DIR 是一个 Deno 环境变量和配置文件目录，它位于本地计算机上，可以用于控制 Deno 模块缓存和命名约定。在 Deno 中使用像 node_modules 这样的文件夹是行不通的，但是，我们可以指定一个文件夹作为 Deno 的模块缓存目录。
我们可以使用 deno cache 命令来缓存指定的模块，缓存模块之后的模块导入是从缓存文件夹中读取的。如下所示：
deno cache --importmap=path-to-import-map.json your-module.ts
其中，--importmap 是一个特殊的标志，用于指示 Deno 命令如何解析和加载模块。我们需要为您的应用程序生成一个 import map 文件，并在缓存命令中使用它。import map 文件包含 URL 到文件的映射。当您导入文件时，Deno 将使用其中的 URL 检索 JavaScript 模块。
另外，我们还可以在代码中设置 globalThis.DENO_DIR 变量来指定模块缓存目录。如下所示：
globalThis.DENO_DIR = "/path/to/cache/dir"; import * as React from "react";
值得注意的是，我们必须在所有其他 import 之前设置 globalThis.DENO_DIR 变量。
3. 使用 deno-npm
deno-npm 是一个 npm 插件，它提供了类似于 npm 的行为，使您可以在 Deno 中使用 npm 包。它工作方式类似于使用 node_modules 文件夹，并自动从 npm 存储库下载依赖项。
下面是如何使用 deno-npm 的示例：
deno install -A --unstable https://deno.land/x/npm/mod.js npm i --save-dev lodash
安装 deno-npm 之后，我们只需要使用 npm 安装所需的依赖项并导入它们。deno-npm 将自动处理依赖项下载和路径解析。
import _ from "lodash";
这种方法非常便利，但由于它使用了第三方插件，因此可能不够安全或稳定。
最佳实践
使用 Deno 时，我们推荐使用第一种方法来解决 npm 包无法找到的问题 - 使用 URL。使用 URL 导入也是 Deno 官方文档推荐的方式。然而，在您需要使用本地缓存和更先进的依赖项管理时，可以尝试使用 DENO_DIR 和 deno-npm。
结论
在本文中，我们探讨了 Deno 无法找到 npm 包的问题，并提供了三种解决方案和最佳实践。出于安全性、可靠性和稳定性的考虑，我们建议使用 URL 导入。但是，在一些特殊情况下，使用 DENO_DIR 和 deno-npm 可以提供更高级的依赖项管理和缓存。希望这篇文章可以对你有所帮助！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6705dfaad91dce0dc8557125