大家好,我是前端小喵
背景: 实践了一下搭建vue3调试环境,踩了一些坑,记录一下
1、从 github 仓库 clone 到本地
git clone https://github.com/vuejs/core.git
2、全局安装pnpm
npm i -g pnpm
window环境:
这里最近用回公司window电脑开发碰到一个报错
解决办法:
2.1、win + x ,然后使用管理员的身份打开powershell
2.2、输入 set-executionpolicy remotesigned 后按y,问题得到解决
3、保证node版本大于16.5.0
直接下载最新版本,切换到最新版本吧,隔了几个月重新安装 vue3源码调试,所需要的最低版本从16.5.0要求到16.14.0
node -v // 查看node版本
我的node版本管理工具是n模块
npm install -g n // 安装n模块
n // 查看当前所有node安装版本 切换版本
n latest // 下载node最新版本
n <version> 例如: n 14.19.0 // 下载指定版本
nvm管理工具
nvm ls(查看已安装版本)
nvm current(查看当前使用的版本)
nvm list available(查看可下载安装的最新版本列表)
nvm install (下载安装指定版本)
nvm use(使用指定的版本)
nvm install latest (下载最新版本)
4、package.json删除puppeteer
这是一个无头浏览器,puppeteer是一个Node库,它提供了一个高级 API 来通过 DevTools 协议控制 Chromium 或 Chrome。访问页面,用来进行截图、自动进行键盘输入,提交表单、模拟点击等用户操作
它比较大,安装耗时比较长,这里我们用不到这些功能,所以暂时去掉了。
5、安装依赖
pnpm i
我在这里报错了
No authorization header was set for the request.
删了pnpm-lock.yaml,该文件锁死了包的版本,重新 pnpm i
安装成功
6、运行项目
npm run serve
6.1、浏览器页面
6.2、进入vue的demo
6.3、随便点开一个目录里的html 就可以打上断点调试了
例如: http://localhost:5000/packages/vue/examples/classic/commits