>웹 프론트엔드 >프런트엔드 Q&A >Vue가 소스 코드를 표시할 수 있나요?

Vue가 소스 코드를 표시할 수 있나요?

藏色散人
藏色散人원래의
2023-01-05 15:17:023130검색

vue能显示源码,vue查看看源码的方法是:1、通过“git clone https://github.com/vuejs/vue.git”获取vue;2、通过“npm i”安装依赖;3、通过“npm i -g rollup”安装rollup;4、修改dev脚本;5、调试源码即可。

Vue가 소스 코드를 표시할 수 있나요?

本教程操作环境:Windows10系统、Vue 3版、Dell G3电脑。

vue能显示源码吗?

能。

Vue查看看源码的技巧

搭建调试环境

  • 获取地址:git clone https://github.com/vuejs/vue.git
  • 安装依赖:npm i
  • 安装rollup:npm i -g rollup(因为是用rollup打包的)
  • script修改dev脚本 加上–sourcemap
"dev": "rollup -w -c scripts/config.js --sourcemap --environment TARGET:web-full-dev",

作用:打包之后 dist 下多了map文件,可以和源码进行很好的映射,方便更好的调试源码
Vue가 소스 코드를 표시할 수 있나요?

  • 执行dev:npm run dev

调试技巧

  • 打开指定文件: ctrl+p (cmd+p)
  • 断点

Vue가 소스 코드를 표시할 수 있나요?

  • 查看调用栈
    特别想搞清除先后之前的调用关系,有时候进入过深就蒙圈了,就好好研究call stack,能给你一个很好的思路

Vue가 소스 코드를 표시할 수 있나요?

  • 定位源文件所在位置

Vue가 소스 코드를 표시할 수 있나요?
掌握了以上,看的次数多了后,源码的执行就很清晰的在脑海中了。

推荐学习:《vue视频教程

위 내용은 Vue가 소스 코드를 표시할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.