前端破圈Win11系统下安装使用Ubuntu子系统🏴‍☠️

前言

自己对使用 Linux 做开发似乎有种执念,也是由于之前使用 Windows 开发留下了一些阴影,本地系统下的程序运行正常,到服务器上不是环境不正常就是这不好使那不太兼容的 😭😭,本地直接安装使用 Linux 做开发,还能用 Windows 上安装各种工作应用等,简直完美 😄😄

开始配置Ubuntu

勾选功能项

首先在 控制面板 -> 程序和功能 -> 启动或关闭 Windows 功能 中勾选 适用于Linux的 Windows 子系统虚拟机平台

重启系统

启动虚拟机平台

bash 复制代码
Enable-WindowsOptionalFeature -Online -FeatureName VirtualMachinePlatform

注意!

这些命令需要使用管理员权限运行,在 PowerShell 中执行

启动Linux子系统

bash 复制代码
Enable-WindowsOptionalFeature -Online -FeatureName Microsoft-Windows-Subsystem-Linux

打开 Microsoft Store 安装

搜索 Ubuntu 并下载,这里选择最新版 Ubuntu 20.04.6 LTS

安装成功后, 直接打开

第一次进入设置 UNIX 用户名和密码,就好了,可以使用 lsb_release -a 命令查看系统版本

注意!

第一次运行可能会遇到如下错误

这是由于没有升级 linux 内核导致的,使用 wsl --update 下载更新即可

bash 复制代码
> wsl --update
正在检查更新...
正在下载更新...
正在安装更新...
此更改将在 WSL 下次完全重启时生效。若要强制重启,请运行"wsl --shutdown"。
内核版本: 5.10.102.1

装好以后重启系统,再次打开 Ubuntu 就正常了

环境检查

这时候系统根目录下什么都没有,也没有 node, 一个干净的系统,开发的环境需要再单独装

前端环境安装

安装node

直接上命令 sudo apt install nodejs

诶哟,什么情况??? 如果经常用 Linux 可能一眼就知道怎么回事了, apt 没有更新导致的

更新apt源

执行 sudo apt update 更新一下 apt 软件源

软件源是Linux系统包管理器中用于提供软件包的服务器

再次执行 sudo apt install nodejs 命令就可以正常安装了,安装成功后检查 node 版本,发现 node 版本不正常,官网长期维护版都已经 18.17.0 了,并且没有 npm,这是由于没有指定安装源的原因

安装curl

换个方式重新安装,先装一下 curl

bash 复制代码
sudo apt-get update
sudo apt-get isntall curl

curl指定源安装node

使用 curl 重新安装 node, 下面的命令直接复制到终端(linux控制台)里敲回车就行了

bash 复制代码
curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash - &&\
sudo apt-get install -y nodejs

到这里,node 的版本就正常了,但是 npm 似乎不正常,我当时各种 Google, Baidu, ChatGPT , Bing 一通搜索没能解决,第二天电脑因为要更新,重启了一下,然后重新打开 Ubuntu 的时候发现好了,致敬万能的 重启 🙃🙃

前端开发环境装好了,可以开始在 Ubuntu 中愉快地编码啦 😀😀

欢迎大家讨论交流,如果文章感觉有用,随手点个赞再走呗 ^_^ 🥰🥰

微信公众号:草帽Lufei

相关推荐
beckyye1 分钟前
给web增加简单的ai对话功能
前端·ai·通义千问·qwen
青衫码上行30 分钟前
【Java Web学习 | 第1篇】前端 - HTML
java·前端·学习
元直数字电路验证31 分钟前
HTML 标签及推荐嵌套结构
前端·javascript·html
charlie11451419132 分钟前
HTML 理论笔记
开发语言·前端·笔记·学习·html·1024程序员节
知识分享小能手1 小时前
uni-app 入门学习教程,从入门到精通,uni-app 企业项目实战:鲁嗑瓜子项目开发知识点(9)
前端·javascript·学习·微信小程序·小程序·uni-app·vue
阿金要当大魔王~~1 小时前
uniapp img 动态渲染 的几种用法
java·服务器·前端·1024程序员节
one.dream1 小时前
用webpack 插件实现 img 图片的懒加载
前端·webpack·node.js
打小就很皮...1 小时前
Steps + Input.TextArea + InfiniteScroll 联调优化
前端·react.js
皓月Code1 小时前
第四章、路由配置
前端·javascript·react.js·1024程序员节
Mr.Jessy2 小时前
JavaScript学习第六天:函数
开发语言·前端·javascript·学习·html·1024程序员节