在VSCode中配置Deno下一代JavaScript运行时环境

1次阅读

vscode 中配置 Deno 需安装官方 Deno 扩展、禁用 typescript 自带功能、运行 Deno: Initialize Workspace Configuration 生成设置,支持类型提示、运行、格式化与 import_map。

在VSCode中配置Deno下一代JavaScript运行时环境

在 VSCode 中配置 Deno 很简单,关键是装对插件、关掉冲突的 TypeScript 插件,并让编辑器信任 Deno 的类型定义。

安装 Deno 和官方扩展

先确保系统已安装 Deno(推荐用 deno install 或官网脚本)。然后打开 VSCode,去扩展市场搜 Deno,安装由 denoland 官方发布的那个(图标是青绿色 D)。别装错成第三方“Deno Support”之类的老插件。

  • Mac/linux:终端运行 curl -fssl https://deno.land/install.sh | sh,再把 bin 路径加进 shell 配置
  • windows:用 PowerShell 运行 iwr https://deno.land/install.ps1 | iex
  • 装完后终端输入 deno --version 确认可用

关闭 TypeScript 自带的语言功能

VSCode 默认用内置 TypeScript 服务,会和 Deno 冲突——比如报错“Cannot find name ‘Deno’”,或类型提示不生效。必须手动禁用它:

  • Cmd+Shift+P(Mac)或 Ctrl+Shift+P(Win/Linux),输入 Preferences: Configure Language Specific Settings…
  • typescript,在打开的 settings.json 片段里加:
    "typescript.preferences.includePackagejsonAutoImports": "off"
  • 再全局设置里搜 typescript.suggest.autoImports,设为 false

启用 Deno 支持并初始化项目

在项目根目录下打开命令面板(Ctrl+Shift+P),运行 Deno: Initialize Workspace Configuration。这会生成一个 .vscode/settings.json,自动开启 "deno.enable": true 并配置好路径。

在VSCode中配置Deno下一代JavaScript运行时环境

易标AI

告别低效手工,迎接AI标书新时代!3分钟智能生成,行业唯一具备查重功能,自动避雷废标项

在VSCode中配置Deno下一代JavaScript运行时环境 135

查看详情 在VSCode中配置Deno下一代JavaScript运行时环境

立即学习Java免费学习笔记(深入)”;

  • 如果 Deno 不在系统 PATH,可在设置里指定完整路径,例如:
    "deno.path": "/Users/xxx/.deno/bin/deno"
  • 新建一个 main.ts,写 console.log(Deno.cwd());,保存后应无红色波浪线,悬停 Deno 能看到类型定义
  • 支持直接运行:右键文件 → Run with Deno,或终端执行 deno run main.ts

可选:配合 import_map 和 lint/formatter

大型项目建议用 import_map.json 统一管理远程模块地址。VSCode Deno 插件原生支持它——只要在设置里配好路径,import 行就能跳转、补全、悬停查看。

  • 创建 import_map.json,内容类似:
    {"imports": {"fmt": "https://deno.land/std@0.224.0/fmt/mod.ts"}}
  • .vscode/settings.json 加:
    "deno.importMap": "./import_map.json"
  • 格式化用 deno fmt,Lint 用 deno lint,VSCode 默认绑定到保存时(需开启 "editor.formatOnSave": true

基本上就这些。不用装 typescript-deno-plugin,不用手动下载 @types/deno,也不用改 tsconfig.json——Deno 插件自己管类型、检查、运行,干净又轻量。

text=ZqhQzanResources