我的 WSL 前端开发体验优化之路

2023-06-24 12:26:22 +08:00
 theprimone

WSL 诞生之前基于 Windows 的开发体验在我印象中很差,大概记得之前还是在 CMD 或者 PowerShell 终端中操作。特别是每次需要重新安装开发环境的时候,是我很不愿意面对的,我都是现打开各种网站下载安装的。另外就是对于开发环境和项目的管理,每次也都会很纠结,这个或者那个东西放哪里合适,多少会有些强迫症。

接触 WSL 之后当时就觉得这种开发方式太 Amazing 了。所以从 WSL 1 一直用到了现在的 WSL 2 ,绝大多数开发时间都是 WSL 上。当然,对于一个相对陌生的环境熟悉起来多少是有点痛苦的,这里有一篇文章总结了大部分的遇到的问题:《当一名前端攻城狮把 WSL 作为主力开发系统之后……》

另外即使是像 Linux 这样的系统已经很方便我们去配置各种东西了,但是由于需要手动去找到各种配置文件再设定合理的配置,这对于上了年纪的人来说并不友好。所以去年又总结了一下自己开发环境的搭建流程:《我的 Windows 开发环境搭建手册》

当时是立了 flag 会弄个脚本的,直到这个端午假期,终于行动起来了。契机是想通过 SSH 连上 WSL ,一通折腾搞定之后赶紧总结了一下,心想着下次再配置开发环境这一套走下来人都麻了吧。

所以前两天爆肝把脚本搞了出来,目前效果还行,满足了基本需求,那之后我就能在任意满足需求的电脑上快速创建出一套统一的开发环境出来,不由得让人很振奋。当然,如果都初始化了一套 WSL 环境出来了,那也完全可以导出镜像之后重复利用,下一步是有这个打算的,不过看起来导出的镜像挺大的,放到云盘的话感觉下载是个大问题 😂

One more thing,脚本搞定之后我又尝试用必剪做了个演示视频,第一次正经尝试做视频,虽然很麻烦,但还挺有意思的。

WSL 2 开发环境脚本搭建演示

这下算是把我对 WSL 做的各种工作梳理完了,一通搞下来也算是为了安利 WSL 吧,毕竟目前还没接触到同好,欢迎各位朋友入坑,有什么意见欢迎交流讨论。接下来的工作就是不断优化 WSL 开发环境和相关脚本了。

最后,本来端午是打算看龙舟的,净折腾这个了,哈哈哈。

6454 次点击
所在节点    前端开发
79 条回复
azusematsuri
2023-06-24 19:20:17 +08:00
@theprimone 美化大概是最重要的,命令只能用 windows 体系的命令了,当然可以自己重命名,比如 New-Alias which get-command
插件我看了下其实只在用 PSReadLine ,可以根据历史记录补全命令,为了最新版的功能还装了 powershell7 。
毕竟是 win 平台,就算重 wsl ,有的时候还是要用用 powershell ,整的舒服点没毛病
theprimone
2023-06-24 19:54:56 +08:00
@azusematsuri 没毛病,抽空我也试试
Moha
2023-06-24 21:30:56 +08:00
wsl2 确实很优雅,一个终端就是 Linux , "code ."直接打开 VSCode 项目,一直在用,没遇到什么问题。微软这一步走的做得还是不错的
theprimone
2023-06-24 22:14:49 +08:00
@Moha 没什么毛病吗?我这都是一路踩坑才到现在勉强算是如鱼得水的感觉 😂
xiangyuecn
2023-06-24 22:36:14 +08:00
贵圈真麻烦😅 我写代码经常一个 notepad 就够用了,除了 xcode 这玩意没办法外
vituralfuture
2023-06-24 22:56:33 +08:00
看来 op 的 blog 觉得到熟练使用 wsl 这一步真是太辛酸了,踩了不知道多少坑
AloneHero
2023-06-24 22:56:52 +08:00
楼主有遇到读写极慢的情况吗,我经常遇到跨文件引用的智能提示非常慢的情况,要加载很久才能提示
phiysng
2023-06-25 00:15:47 +08:00
Hyper-V 的那个动态端口非常坑,Hyper-V 保留了一堆端口,自己也没有用,也不准你用,netstat 也看不到占用,你不知道这件事真的一头雾水。
Aloento
2023-06-25 00:50:27 +08:00
@israinbow 请置评
Routeros
2023-06-25 00:58:22 +08:00
@phiysng 纳尼?怎么重现?证实?
azusematsuri
2023-06-25 01:42:03 +08:00
@phiysng 对的我前两天也被这个坑了,开 hyperv 之后一开机发现 clash 等等一堆服务监听不了
Features
2023-06-25 02:19:56 +08:00
纯前端开发,没有什么比 mac 更好的
一个 npm 插件,在宿主机上运行好好的,在 WSL 上出问题就够折腾半天
生命苦短,我用 mac
kid1412621
2023-06-25 02:21:47 +08:00
VPN 支持不行
mattxlee
2023-06-25 03:26:15 +08:00
如果只是 node 开发,为什么要用 wsl?,windows 原生 node 就挺好的,配个 vim 或者 vscode 。折腾 wsl 只是为了那些必须要在 linux 下完成的事情。
theprimone
2023-06-25 09:00:04 +08:00
@xiangyuecn 这就是返璞归真吗?
theprimone
2023-06-25 09:01:01 +08:00
@vituralfuture 哈哈哈,说多了都是泪,不过死磕下来还是收获不少的。
theprimone
2023-06-25 09:04:04 +08:00
@AloneHero 我配置了保存自动 eslint fix 和 prettier format ,有时候会碰到卡很久的情况,不知道是不是你说的这种情况
theprimone
2023-06-25 09:08:00 +08:00
@phiysng 确实,当我看到有人提示也是大受震撼,原来是 Hyper-V 导致的吗,不过我记录的这两个命令不是能查看吗?

netsh int ipv4 show excludedportrange protocol=tcp
netsh int ipv4 show dynamicport tcp
MEIerer
2023-06-25 09:09:10 +08:00
wsl 启动有点卡,不知是不是我装插件多了的问题
theprimone
2023-06-25 09:10:42 +08:00
@Features 这不巧了吗,我上个工作就是用了公司一年多的 macbook ,真不习惯,还是 Windows + WSL 舒服,哈哈哈。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/951174

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX