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

[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 开发环境和相关脚本了。

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

[fd9xr]

生命苦短

[murmur]

其实不考虑 node 版本，windows 自己开发前端就挺好的

[gordon96]

wsl + docker 目前体验良好，不需要 linux 开发机了，就是感觉 wsl 有点内存泄漏。。。。。

[theprimone]

@fd9xr 您用 Python ？

[theprimone]

@murmur 在 Windows 上开发体验没有给我留下什么好印象 😂 特别喜欢 Linux 下有丰富的终端可以选择，还能各种定制，Windows 好用的大概就 Git Bash 了，没太多了解，后来发现 Git Bash 也能安装 Zsh ，应该可玩性高了不少。

另外现在 Windows Terminal 有了，Windows 下的终端至少看起来也不至于太拉了 😂

[theprimone]

@gordon96 Docker 之后我也打算整一个学习学习，内存泄漏感觉是有的，偶尔 wsl --shutdown 一下

[fox0001]

没看文章，心想，不就是微软商店双击一下 Debian 或者 Ubuntu 嘛。

看了下文章，原来很大部分都是 Linux 方面的配置了。

[theprimone]

@fox0001 安装当然很简单啦，追求的怎么实现始终如一的开发体验 😄

[azusematsuri]

powershell 现在可以装很多插件了，还有 oh-my-posh 美化，使用体验完全没有以前那么糟糕，可以看下这个教程
https://beebom.com/how-customize-windows-terminal-2/

[cylx3124]

@gordon96
@theprimone

wsl 1.3.10 增加了闲置内存回收，不知道实际效果怎么样 https://github.com/microsoft/WSL/releases/tag/1.3.10

Memory reclamation idle detection, drop_caches. To use add the below to %userprofile%\.wslconfig
[experimental]
autoMemoryReclaim=true

[fox0001]

@theprimone #8 我不追求始终如一的开发体验，因为不能追求。说多了都是泪…

[ty29022]

羡慕你们这种颇具仪式感的开光流程
我们 linux 用户就朴素多了，dotfile pull 下来就完事

[theprimone]

@azusematsuri 好家伙，原来 PowerShell 也可以了啊，有机会我试试。不过不知道各种命令和插件咋适配？还是说只是用来美化？

[theprimone]

@cylx3124 学习了，不过确实不好测试，但是可以保持关注

[theprimone]

@fox0001 😦 不能追求是什么说法

[dcsuibian]

我觉得像前端和 java 这种对平台依赖性不强的没有啥必要追求 wsl ，直接运行反而有更好的性能

[theprimone]

@ty29022 大佬细说，我怎么直接搜索 dotfile pull 感觉没有啥有效信息的感觉呢？倒是找到个这个 https://github.com/twpayne/chezmoi

[Frankcox]

我使用 wsl2 开发前端主要用 Vue ，但是有时候有些问题：
1.使用 npm run serve 的话有时候在 windows 里浏览器识别不到 web 服务，localhost:8080 、127.0.0.1:8080 或者 wsl-ip:8080 都无法访问。
2.不知道是不是 IO 问题，vscode 在 npm run serve 的时候编辑代码，有概率会断开 wsl2 连接，重启 wsl2 服务后才好用。

[theprimone]

@dcsuibian 开发体验是一点，其他优点的话，大概是更好的平台一致性吧，比如我本地编译跟 CI 环境基本就是一样的，甚至还有些 npm 包在 Windows 下有些奇奇怪怪的问题 😂

[theprimone]

@Frankcox 第一个问题我猜可能跟 Windows 动态端口范围有关，可以看看我这篇文章 https://juejin.cn/post/7037893084998270990#heading-3 第二个问题的话我极少数情况下会碰到 WSL 自己就终止的情况，我才可能跟内存有关系，基本都是在我开了很多东西之后才出现的。