vue -- 项目调试
2024-09-03 13:52:32
方式1:vue-devtools插件
vue-devtools是一款基于chrome游览器的插件,用于调试vue应用,这可以极大地提高我们的调试效率。
使用步骤
1、 到github下载:https://github.com/vuejs/vue-devtools
2、 在vue-devtools目录下安装依赖包
cd vue-devtools
cnpm install
3、 扩展Chrome插件
Chrome浏览器 > 更多程序 > 拓展程序
4、 vue-devtools使用
vue项目, 打开f12, 选择vue就可以使用了。
使用debugger和sourcemap调试Vue组件(重点)
针对vue-cli webpack官方脚手架,打开build/webpack.dev.conf.js文件,找到下面这句:
devtool: '#cheap-module-eval-source-map',
新版本也可在config/index.js中找到,注意是在开发环境里(dev),
修改为:
devtool: '#eval-source-map',
好了,一不小心要改的配置已经改完了~
使用:
现在是具体调试了。假设我们想调试App.vue这个组件,可以在想要调试的代码前添加debugger方法。
最新文章
- Oracle 列数据聚合方法汇总
- 使用CSS/JS代码修改博客模板plus
- (转)Java + Excel 接口自动化
- poj -2010 Moo University - Financial Aid (优先队列)
- GridControl 复合表头(多行标题)
- AWK 简明教程
- 《python基础教程》笔记之 元组
- 重新想象 Windows 8 Store Apps (10) - 控件之 ScrollViewer 特性: Chaining, Rail, Inertia, Snap, Zoom
- css远距离链接
- 接口开发,tp5结合swagger-ui安装方法
- vue组件-构成组件-父子组件相互传递数据
- C#基础知识之读取xlsx文件Excel2007
- docker学习笔记一
- firfox中";content-disposition";, ";attachment;filename=“+filename不能显示文件名字
- 谁考了第k名
- 部署WEB项目到服务器(二)安装tomcat到linux服务器(Ubuntu)详解
- 计算正多边形的面积 Gym - 101840G
- .NET Core下的Socket示例.
- HTML如何实现滚动文字
- 查看设备uuid的命令-blkid