Logo

菜单

发布于 2026-01-05 2 阅读
0

提升您的 Windows 开发效率：WSL 终极指南🚀📟

提升您的 Windows 开发效率：WSL 终极指南🚀📟

嗨！我是鲍里斯！

我是一名软件工程师，主要从事保险行业，同时也在培训其他开发人员，并在各种会议上发表演讲。多年来，我使用过各种各样的开发环境和操作系统，但除了.NET开发之外，我个人一直不太喜欢在Windows下进行开发。这是为什么呢？让我们深入探讨一下。

嗯，我的大部分问题都可以归结为一个词：麻烦。无论是日常使用 Windows 系统，你经常会遇到各种各样的问题，操作系统本身就处处刁难你。这样的例子不胜枚举，比如注册表问题、软件包管理、切换 Node 版本，还有 Windows 更新——光是 Windows 更新本身就足以让人对这个系统失去兴趣。

所以你应该能明白为什么我会对下图中的乌鸦产生共鸣了。

https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3gpwe8ax86eeh6ccpgsi.png

我没有放弃寻找可行的解决方案。而且，我（勉强）找到了。那就是——WSL。

WSL是什么？我为什么要对它感兴趣？

Windows 子系统 Linux 版 (WSL) 允许开发者直接在 Windows 系统上运行功能齐全的原生 GNU/Linux 环境。换句话说，我们可以直接运行 Linux，而无需使用虚拟机或双启动系统。

WSL 最棒的地方在于，它让你无需切换操作系统，就能在现有操作系统内同时享受到两种系统的优势。
这对我们普通用户来说意味着什么呢？WSL 的实际运行方式可以看作是 Windows 的一项功能，它直接在 Windows 10 或 11 中运行 Linux 系统，并拥有功能齐全的 Linux 文件系统、Linux 命令行工具以及各种 Linux 图形界面应用（顺便说一句，这些应用真的很棒）。此外，与虚拟机相比，WSL 运行所需的资源更少，而且无需单独的工具来创建和管理虚拟机。

WSL 主要面向开发者，因此本文将重点介绍开发者如何使用它，以及如何使用 VS Code 搭建一个功能齐全的开发环境。本文将介绍一些实用功能及其在实践中的应用。此外，了解新事物的最佳方法就是实际操作。

觉得这篇文章有用吗？

我们Wasp团队正在努力  创作这样的内容，更不用说我们还在构建一个现代化的开源 React/NodeJS 框架了。

表达支持最简单的方法就是给 Wasp 代码库点个星标！🐝 如果您能浏览一下代码库（无论是为了贡献代码，还是仅仅为了测试产品），我们将不胜感激。点击下方按钮给 Wasp 点个星标，表达您的支持！

wasp_arnie_handshake

⭐️ 感谢您的支持 💪

在 Windows 操作系统上安装 WSL

要在 Windows 上安装 WSL，首先需要启用Hyper-V架构，它是微软的硬件虚拟化解决方案。要安装 Hyper-V，请右键单击 Windows 终端/PowerShell 并以管理员身份打开它。

图片描述

然后，运行以下命令：



Enable-WindowsOptionalFeature -Online -FeatureName Microsoft-Hyper-V -All
Enter fullscreen mode Exit fullscreen mode

这将确保您具备安装所需的所有先决条件。然后，以管理员身份打开 PowerShell（最好在 Windows 终端中打开）。然后，运行



wsl —install
Enter fullscreen mode Exit fullscreen mode

有很多Linux发行版可供选择，但Ubuntu是默认安装的。本指南将介绍许多控制台命令，但其中大部分只需复制粘贴即可完成。

如果您之前安装过 Docker，那么您的系统很可能已经安装了 WSL 2。在这种情况下，系统会提示您安装所需的发行版。由于本教程将使用 Ubuntu，我建议运行以下命令。



 wsl --install -d Ubuntu
Enter fullscreen mode Exit fullscreen mode

安装完 Ubuntu（或其他你选择的发行版）后，你将进入 Linux 操作系统，并看到欢迎界面。在这里，你需要输入一些基本信息。首先是用户名，然后是密码。用户名和密码都是 Linux 特有的，所以你不需要重复使用 Windows 的凭据。完成这些步骤后，安装就完成了！你已成功在 Windows 机器上安装了 Ubuntu！现在说起来还是觉得有点不可思议，对吧？

等一下！

但在我们开始设置开发环境之前，我想向你展示一些很棒的技巧，这些技巧将使你的生活更轻松，并帮助你理解为什么 WSL 实际上改变了 Windows 用户的游戏规则。

WSL 的第一个优点是，你无需放弃目前通过 Windows 资源管理器管理文件的方式。现在，你可以在 Windows 资源管理器的侧边栏中，网络选项卡下方找到 Linux 选项。

图片描述

通过 Windows 资源管理器，您可以直接访问和管理 Linux 操作系统的文件系统。这项功能最棒的地方在于，您可以轻松地在不同的操作系统之间复制、粘贴和移动文件，这开启了无限可能。实际上，您无需对文件工作流程进行太多更改，即可轻松地将多个项目和文件从一个操作系统迁移到另一个操作系统。例如，如果您在 Windows 浏览器上下载了 Web 应用程序所需的图像，只需将其复制并粘贴到 Linux 操作系统即可。

图片描述

另一个非常重要的东西，我们将在示例中用到，是 WSL2 虚拟路由。由于你的操作系统内部现在运行着另一个操作系统，它们之间可以进行通信。当你想要访问 Linux 操作系统的网络时（例如，当你想要访问在 Linux 中本地运行的 Web 应用程序时），可以使用`${PC-name}.local`。例如，我的电脑名称是 Boris-PC，所以我的网络地址是 boris-pc.local。这样你就不用记住不同的 IP 地址了，非常方便。如果你出于某种原因需要查看你的地址，可以打开 Linux 发行版的终端，输入 `ipconfig` 命令。然后，你就可以看到你的 Windows IP 地址和 Linux IP 地址了。这样，你就可以在两个操作系统之间无缝通信了。

图片描述

最后我想重点介绍一下Linux图形界面应用程序。这项功能非常实用，也让WSL对普通用户更具吸引力。您可以使用流行的包管理器（例如apt（Ubuntu默认）或flatpak）在Linux系统上安装任何您想要的应用程序。然后，您也可以从命令行启动它们，应用程序会在Windows操作系统中启动并显示。但这可能会造成一些不便，而且不够用户友好。这项功能真正突破性的地方在于，您可以直接从Windows操作系统启动它们，而无需启动WSL。因此，您可以轻松创建快捷方式并将其固定到“开始”菜单或任务栏，完全无需考虑应用程序的来源。为了演示，我安装了Dolphin文件管理器，并在Windows操作系统中运行它。您可以在下方看到它与Windows资源管理器的并排显示。

图片描述

在 WSL 上开始开发

了解了 WSL 的各种炫酷功能之后，让我们继续本教程。接下来我们将搭建开发环境并启动第一个应用程序。我将搭建一个 Web 开发环境，并以Wasp为例进行说明。

如果您还不熟悉 Wasp，它是一个类似 Rails 的框架，支持 React、Node.js 和 Prisma。它能让您快速轻松地开发和部署全栈 Web 应用。对于我们的教程而言，Wasp 是理想之选，因为它本身并不原生支持 Windows 开发，而只能通过 WSL 进行开发，因为它需要 Unix 环境。

我们先从安装 Node.js 开始。目前，Wasp 要求用户使用 Node v18（版本要求很快就会放宽），所以我们要先安装 Node.js 和 NVM。

但首先，我们先从 Node.js 开始。在 WSL 中运行：



sudo apt install nodejs
Enter fullscreen mode Exit fullscreen mode

要在 Linux 环境中安装 Node.js，接下来是 NVM。我建议访问https://github.com/nvm-sh/nvm并从那里获取最新的安装脚本。当前下载链接为：



curl -o- [https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.5/install.sh](https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.5/install.sh) | bash
Enter fullscreen mode Exit fullscreen mode

至此，我们的系统中就同时安装了Node.js和NVM。

接下来是在我们的 Linux 环境中安装 Wasp。Wasp 的安装也非常简单直接。只需复制并粘贴以下命令：



curl -sSL [https://get.wasp-lang.dev/installer.sh](https://get.wasp-lang.dev/installer.sh) | sh
Enter fullscreen mode Exit fullscreen mode

然后等待安装程序完成。太好了！但是，如果您是从零开始安装 WSL，您会在下方看到以下警告：'/home/boris/.local/bin' 似乎不在您的 PATH 环境变量中！您将无法通过名称从终端调用 wasp。

图片描述

我们快速解决这个问题。为此，我们运行……



 code ~/.profile
Enter fullscreen mode Exit fullscreen mode

如果尚未安装 VS Code，它会自动设置所有必需组件并启动，以便您可以将命令添加到文件末尾。每个人的系统名称不同，因此命令也会有所不同。例如，我的系统名称是：



export PATH=$PATH:/home/boris/.local/bin
Enter fullscreen mode Exit fullscreen mode

太棒了！现在我们只需要将 Node 版本切换到 v18.14.2，以确保与 Wasp 完全兼容。我们将一次性完成 Node 18 的安装和切换！为此，只需运行：



nvm install v18.14.2 && nvm use v18.14.2
Enter fullscreen mode Exit fullscreen mode

设置好 Wasp 之后，我们想看看如何运行该应用程序并从 VS Code 访问它。底层开发仍然会使用 WSL，但大部分操作我们都可以在宿主操作系统（Windows）上使用 VS Code。

图片描述

首先，请在 Windows 系统中将WSL 扩展下载到 VS Code 中。之后，我们创建一个新的 Wasp 项目，看看它是如何工作的。打开 VS Code 命令面板（Ctrl + Shift + P），然后选择“在 WSL 中打开文件夹”选项。

图片描述

我打开的文件夹是



\\wsl.localhost\Ubuntu\home\boris\Projects
Enter fullscreen mode Exit fullscreen mode

这是我在 WSL 中主文件夹下的“Projects”文件夹。我们可以通过两种方式判断自己是否处于 WSL 环境中：顶部栏和 VS Code 的左下角。这两个地方都会显示“WSL: Ubuntu”，如屏幕截图所示。

图片描述

图片描述

进入这个文件夹后，我会打开一个终端。它也已经连接到 WSL 中的正确文件夹，所以我们可以开始工作了！让我们运行……



wasp new
Enter fullscreen mode Exit fullscreen mode

创建新 Wasp 应用程序的命令。我选择了基本模板，但您可以自由创建所需的项目，例如预配置了 GPT、Stripe 等功能的SaaS 入门项目。如屏幕截图所示，我们需要将项目当前目录更改为正确的目录，然后运行项目。



wasp start
Enter fullscreen mode Exit fullscreen mode

图片描述

就这样，我的 Windows 电脑上打开了一个新窗口，显示我的 Wasp 应用已启动。太棒了！我的地址仍然是默认的 localhost:3000，但它实际上是在 WSL 中运行的。恭喜，您已成功通过 WSL 启动了您的第一个 Wasp 应用。这并不难，对吧？

图片描述

最后，我想重点介绍一下 WSL 中的 Git 工作流程，因为它设置起来相对简单。当然，你也可以手动配置 Git，但我这里有个更酷的技巧：在 Windows 和 WSL 之间共享凭据。要设置 Git 凭据共享，我们需要执行以下操作：在 Windows 上的 PowerShell 中，配置 Windows 的凭据管理器。



git config --global credential.helper wincred
Enter fullscreen mode Exit fullscreen mode

让我们在 WSL 中也进行同样的操作。



git config --global credential.helper "/mnt/c/Program\ Files/Git/mingw64/bin/git-credential-manager.exe"
Enter fullscreen mode Exit fullscreen mode

这样我们就可以共享 Git 用户名和密码。在 Windows 系统中设置的任何内容都可以在 WSL 中使用（反之亦然），我们可以在 WSL 中按照自己的喜好使用 Git（通过 VS Code 图形界面或 shell）。

结论

通过本次学习，我们了解了 WSL 是什么，它如何帮助我们提升 Windows PC 的工作流程，以及如何在 WSL 上搭建初始开发环境。微软在这个工具上做得非常出色，真正让 Windows 操作系统成为所有开发者更易上手、更可行的选择。我们学习了如何安装启动开发所需的开发工具，以及如何掌握基本的开发工作流程。如果您想深入了解该主题，以下是一些重要链接：

文章来源：https://dev.to/wasp/supercharge-your-windows-development-the-ultimate-guide-to-wsl-195m
如何在 TypeScript 中使...
保持 Git 历史记录的整洁——101