引言
在前端开发中, 可能会遇到
-
有些项目在 Windows 环境下跑不起来
-
Windows 下打包构建速度较慢的情况
-
想跑一些 Shell 脚本
-
想在 Windows 上跑 Docker
但手头又没有 Mac/Linux 环境
此时可以使用 WSL2 来安装一个 Ubuntu 子系统解决
开启 Windows 相关功能
在 Windows 的任务栏中搜索 启用或关闭 Windows 功能
然后确定, 以下几个功能处于被勾选的状态
- Hyper-V
- 适用于 Linux 的 Windows 子系统
- 虚拟机平台
如果处于未勾选的状态, 将它们勾选上, 然后点击确定, 然后重启电脑
安装 Ubuntu
在 Windows 的任务栏中搜索 Microsoft Store
然后搜索 Ubuntu
可以安装 Ubuntu 22.04 或 Ubuntu 24.04, 这两个都是 LTS 版本
安装成功之后, 在 Windows 的任务栏中搜索 Ubuntu 然后会自动开始系统安装
升级到 WSL2
WSL1 和 WSL2 的区别
- WSL1: 基于翻译层, 将 Linux 系统调用转换为 Windows 系统调用
- WSL2: 基于虚拟机, 运行完整 Linux 内核, 支持更多的 Linux 特性和工具, 比如 docker
下载 WSL2 升级包
首先确定 Windows(10) 系统的版本号大于 1903 版本或更高, 现在新安装的 Windows10 基本上都是 22H2 版本, 大都是可以满足要求的
下载 WSL2 升级包: wslstorestorage.blob.core.windows.net/wslblob/wsl…
进行安装
转换 WSL1 到 WSL2
然后在终端中输入以下命令来查看当前 wsl 的版本
wsl -l -v
如果 Version 显示的是 1, 那就是处于 WSL1 的状态
通过执行命令, 来升级到 WSL2, 其中 Ubuntu-22.04 要换成你自己安装的 Ubuntu 版本的名字
wsl --set-version Ubuntu-22.04 2
然后等待执行完成就可以了
执行结束后再次查看当前当前 wsl 版本
配置 ssh (Ubuntu下)
因为众所周知的原因, https 的方式有可能下载速度慢或者连接失败, 通过配置 ssh 的方式会所有改善
执行以下命令, 将 your_email@example.com 换成你自己的邮箱(也可以不换)
ssh-keygen -t rsa -b 4096 -C "your_email@example.com"
然后一路 Enter
执行以下命令查看 ssh 公钥
cat ~/.ssh/id_rsa.pub
然后将它粘贴到你的 Github / GitLab ssh 中, 这样就可以通过 ssh 的方式来 clone 仓库了
安装 node 环境 (Ubuntu下)
安装 nvm 来控制 node 版本
首先更新源
sudo apt update
clone 仓库
git clone git@github.com:nvm-sh/nvm.git ~/.nvm
更新 nvm 版本
cd ~/.nvm
git checkout `git describe --abbrev=0 --tags` # 切换到最新稳定版本
添加 nvm 到 shell 配置文件中
echo 'export NVM_DIR="$HOME/.nvm"' >> ~/.bashrc
echo '[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"' >> ~/.bashrc
source ~/.bashrc
验证 nvm 安装
nvm --version
安装 node 环境
nvm list avalible
nvm install 20.18.1
nvm use 20.18.1
验证 node 安装
node -v
安装 zsh (Ubuntu下)
升级依赖
sudo apt update
安装 zsh
sudo apt install zsh
设置 zsh 为默认 Shell
chsh -s $(which zsh)
配置 nvm
code ~/.zshrc
添加一下内容到 文件末尾
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm
安装 oh-my-zsh (Ubuntu下)
官网地址: ohmyz.sh/
clone 仓库
git clone git@github.com:ohmyzsh/ohmyzsh.git ~/.oh-my-zsh
复制配置文件作为个人的配置文件
cp ~/.oh-my-zsh/templates/zshrc.zsh-template ~/.zshrc
安装 oh-my-posh (Windows下)
关于 终端 与 Shell
终端
- 一个程序, 提供了一个窗口
- 可以输入命令和看到结果
Shell
- 一个程序, 负责解释和执行你输入的命令
- 运行在终端里, 处理用户输入的指令
- 常见的 Shell 有 Bash, Zsh 等
关于 PowerShell 与 PowerShell7
PowerShell
微软在 2006 年推出了 PowerShell, 是一种面向对象的脚本语言, 支持与 .NET 的集成
PowerShell7
跨平台的 PowerShell
安装 Windows Terminal
在 Microsoft Store 中搜索 Windows Terminal, 安装后可以在任务栏中的搜索中输入 终端 来启动它
安装 PowerShell7
直接去 Github 上找到 PowerShell 的最新 Release (正式版) 然后找到对应的版本下载即可: github.com/PowerShell/…
下载后一路 Next 即可完成安装, 安装成功后可以在终端中
选择 PowerShell 即可打开 PowerShell7
其中 Windows PowerShell 是 Windows 自带的 PowerShell6, 注意区分
安装 on-my-posh
在 Microsoft Store 中搜索 oh-my-posh, 来安装它
官网地址: ohmyposh.dev/
安装 Nerd Font
因为 on-my-posh 下有一些带图标或者特殊符号的主题, 使用默认的 Consola 字体会显示乱码, 所以需要下一个 Nerd Font
在 www.nerdfonts.com/font-downlo… 中下载你喜欢的字体, 这里推荐使用 JetBrainsMono Nerd Font
注意: 这里并不需要安装下载回来压缩包中所有的字体, 在里面找到一个最适合自己的即可, 这里推荐只安装 JetBrainsMonoNerdFontMono-Medium 即可
然后记得在终端的设置中, 配置上你的新字体
配置 PowerShell7
powerShell7 在启动时会自动加载并执行这个配置文件
首先需要新建这个配置文件, 在终端中执行以下命令
New-Item -Path $PROFILE -Type File -Force
配置这个配置文件
# 使用 vscode 打开
code $PROFILE
# 或使用 记事本 打开
notepad $PROFILE
在打开的配置文件中粘贴以下代码
配置使用默认 oh-my-posh 主题
oh-my-posh init pwsh | Invoke-Expression
配置使用 tokyonight_storm 主题
oh-my-posh init pwsh --config "$env:POSH_THEMES_PATH\tokyonight_storm.omp.json" | Invoke-Expression
以上两种配置是二选一的
想配置其他主题具体参考: ohmyposh.dev/docs/themes
VSCode 的 WSL 插件
在 vscode 的插件列表中搜索 wsl 然后安装
然后在 Ubuntu 终端下输入 code ./
就可以在当前所在的文件夹下打开 vscode 了
这样就实现了在 Windows 下使用 VSCode 在 Ubuntu 环境下开发代码了
WebStorm 的配置
在 WebStorm 中是支持直接访问 WSL2 中的文件系统的, 就像打开你的本地项目一样
启动配置
如果你熟悉使用 WebStorm, 你可能会想通过点击这个按钮的方式来启动项目
不过在 WSL2 环境下直接点击这个是跑不起来的, 需要配置一下
在这里选择上 WSL 中安装的 Ubuntu
实际收益
实测, 在没有 turborepo 缓存的情况下打包司内某js工具库
在 Windows 下的耗时为: 3m34s
在 Ubuntu(WSL2) 下的耗时为: 2m30s
打包司内组件库项目
在 Windows 下耗时: 9m21s
在 Ubuntu(WSL2) 下耗时为: 2m20s
打包速度提升非常明显
