WSL + VSCode + Git + Node.js 开发环境配置文档

以下是 完整 WSL 开发环境配置文档


适用:Windows 10/11 + WSL2 + Ubuntu

用途:Hardhat / Node.js / Git 开发


🖥️ 1. Windows 配置 WSL:点击搜索打开 Ubuntu

1.1 安装 WSL2

cmd 复制代码
# 以管理员运行 PowerShell
wsl --install

✅ 自动安装 WSL2 + Ubuntu(重启电脑)

1.2 设置 Ubuntu 为默认 WSL 发行版

cmd 复制代码
wsl --set-default Ubuntu

1.3 创建快捷方式(可选)

  • 打开 C:\Users\你的用户名\AppData\Roaming\Microsoft\Windows\Start Menu\Programs

  • 新建快捷方式,目标:

    复制代码
    wsl -d Ubuntu
  • 命名为 Ubuntu

✅ 现在你可以在 Windows 搜索 中输入 Ubuntu,点击打开 WSL!


🌐 2. WSL 镜像映射 Windows 网络(代理 + 互通)

2.1 设置代理(WSL 使用 Windows 代理)

bash 复制代码
# 1. 获取 Windows IP
export WINDOWS_HOST_IP=$(grep -oP '(?<=nameserver\ ).*' /etc/resolv.conf)

# 2. 设置代理(端口按你的工具改:Clash=7890, Nginx=8080)
export http_proxy=http://$WINDOWS_HOST_IP:7890
export https_proxy=http://$WINDOWS_HOST_IP:7890
export no_proxy=localhost,127.0.0.1

# 3. 永久设置(写入 ~/.bashrc)
echo "export WINDOWS_HOST_IP=\$(grep -oP '(?<=nameserver\ ).*' /etc/resolv.conf)" >> ~/.bashrc
echo "export http_proxy=http://\$WINDOWS_HOST_IP:7890" >> ~/.bashrc
echo "export https_proxy=http://\$WINDOWS_HOST_IP:7890" >> ~/.bashrc
echo "export no_proxy=localhost,127.0.0.1" >> ~/.bashrc
source ~/.bashrc

2.2 测试网络

bash 复制代码
curl -v https://www.google.com

✅ 如果返回 HTML,说明代理成功!

2.3 文件互通

方向 操作
WSL → Windows cd /mnt/c(C盘)、/mnt/d(D盘)
Windows → WSL 文件资源管理器输入:\\wsl$

🍺 3. 安装 Homebrew(Linux 包管理器)

3.1 安装依赖

bash 复制代码
sudo apt update
sudo apt install -y build-essential curl file git

3.2 安装 Homebrew

bash 复制代码
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

3.3 添加到 PATH

bash 复制代码
echo 'eval "$(/home/linuxbrew/.linuxbrew/bin/brew shellenv)"' >> ~/.bashrc
eval "$(/home/linuxbrew/.linuxbrew/bin/brew shellenv)"

3.4 测试

bash 复制代码
brew --version

✅ 输出:Homebrew 4.x.x
💡 常用命令:

  • brew install wget:安装 wget
  • brew install gh:安装 GitHub CLI

🔧 4. 安装 NVM 和 Node.js

4.1 安装 NVM(Node.js 版本管理器)

bash 复制代码
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash
source ~/.bashrc

4.2 安装 Node.js(推荐 18.x LTS)

bash 复制代码
nvm install 18
nvm use 18
nvm alias default 18

4.3 验证

bash 复制代码
node --version  # v18.x.x
npm --version   # 9.x.x

4.4 配置 npm 镜像(加速下载)

bash 复制代码
npm config set registry https://registry.npmmirror.com

💡 常用命令:

  • nvm install 20:安装 Node.js 20
  • nvm use 18:切换版本
  • npm init -y:创建 Node.js 项目

💻 5. 使用 Windows VSCode 开发 WSL

5.1 在 Windows 安装 VSCode

5.2 安装 "Remote - WSL" 插件

  • VSCode 插件市场搜索:Remote - WSL → 安装

5.3 连接到 WSL

方法 操作
命令行(推荐) 在 WSL 终端运行:code .
VSCode 侧边栏 点击左下角绿色图标 → "Connect to WSL"

5.4 安装插件(在 WSL 内安装)

  • ESLint(代码检查)
  • Prettier(代码格式化)
  • GitLens(Git 增强)
  • Node.js(Node 开发)
  • Hardhat(搜索 "Hardhat" 插件)
  • Solidity(如果开发合约)

5.5 设置默认终端

  • VSCode 中按 Ctrl+Shift+P → 输入 Terminal: Select Default Profile
  • 选择 Ubuntu (WSL)

🔑 6. Git 配置(WSL 内独立安装)

6.1 安装 Git

bash 复制代码
sudo apt install -y git

6.2 配置 Git 用户

bash 复制代码
git config --global user.name "你的GitHub用户名"
git config --global user.email "你的邮箱@example.com"

6.3 生成 SSH 密钥(登录 GitHub)

bash 复制代码
ssh-keygen -t ed25519 -C "你的邮箱@example.com" -f ~/.ssh/github_id_ed25519
eval "$(ssh-agent -s)"
ssh-add ~/.ssh/github_id_ed25519

6.4 复制公钥到 GitHub

bash 复制代码
cat ~/.ssh/github_id_ed25519.pub
  • 登录 GitHub → Settings → SSH and GPG keys → New SSH key → 粘贴

6.5 测试 SSH

bash 复制代码
ssh -T git@github.com

✅ 成功输出:Hi 用户名! You've successfully authenticated...


📌 常用命令速查表

命令 说明
wsl -d Ubuntu Windows 启动 Ubuntu
cd /mnt/c WSL 访问 Windows C盘
\\wsl$ Windows 访问 WSL 文件
export http_proxy=... 设置代理
brew install wget 用 Homebrew 安装 wget
nvm install 18 安装 Node.js 18
npm config set registry ... 设置 npm 镜像
code . WSL 中用 VSCode 打开当前目录
git config --global user.name 配置 Git 用户名
ssh-add ~/.ssh/github_id_ed25519 添加 SSH 密钥

✅ 配置完成!

你现在拥有:

  • Windows 搜索打开 WSL
  • WSL 使用 Windows 代理 + 文件互通
  • Homebrew 管理 Linux 包
  • NVM 管理 Node.js 版本
  • VSCode 远程开发 WSL
  • Git + SSH 登录 GitHub
相关推荐
Q_Q196328847543 分钟前
python+springboot+uniapp基于微信小程序的校园二手闲置二手交易公益系统 二手交易+公益捐赠
spring boot·python·django·flask·uni-app·node.js·php
Q_Q19632884753 小时前
python+spring boot洪涝灾害应急信息管理系统 灾情上报 预警发布 应急资源调度 灾情图表展示系统
开发语言·spring boot·python·django·flask·node.js·php
yan8626592469 小时前
git操作
git
六点半8889 小时前
【Git】分⽀管理
git
三十_A9 小时前
【实录】使用 Verdaccio 从零搭建私有 npm 仓库(含完整步骤及避坑指南)
前端·npm·node.js
weixin_456904279 小时前
离线下载npm包
前端·npm·node.js
zhennann10 小时前
VonaJS多租户同时支持共享模式和独立模式
数据库·typescript·node.js·nestjs
寒山李白11 小时前
VSCode中Python库识别的设置(关于解决VSCode中Python库引入未下载的库不显示黄色虚线的问题)
ide·vscode·python
深鱼~12 小时前
VSCode+WSL+cpolar:打造跨平台的随身Linux开发舱
linux·ide·vscode
谢尔登13 小时前
【Node.js】Express 和 Koa 中间件的区别
中间件·node.js·express