博客
关于我
vue调试工具vue-devtools安装及使用
阅读量:313 次
发布时间:2019-03-04

本文共 652 字,大约阅读时间需要 2 分钟。

安装vue-devtools

在安装vue-devtools之前,请确保已为此进行正确准备。以下是详细的安装步骤:

  • 下载代码

    为了避免克隆后进入错误分支,建议直接下载完整的zip文件而非使用git clone。zip文件中的代码将直接从master主分支获取,确保编译正确无误。

  • 安装依赖

    打开终端,进入vue-devtools目录,执行以下命令安装所需依赖:

    cd vue-devtools  cnpm install
  • 编译打包

    下载完成后,运行以下命令进行编译和打包:

    cnpm run build

    打包完成后,系统会在shells目录下生成一个chrome文件夹,准备好在Chrome浏览器中使用。

  • 加载扩展程序

    打开Chrome浏览器,进入扩展程序页面(Chrome > 更多工具 > 扩展程序)。点击“加载已解压的扩展程序”,选择刚刚生成的chrome文件夹,找到vue-devtools > shells > chrome,然后点击安装。完成后,您将看到确认提示。

  • 使用vue-devtools

    在使用vue-devtools时:

  • 打开您的Vue项目,在开发者工具(F12)中选择“Vue”选项即可开始使用。

  • 由于Vue是数据驱动的,您将能够直接查看并调试对应数据,方便开发和调试工作。

  • 注意事项:

    • 使用cnpm命令:请确保在所有步骤中始终使用cnpm而非npm
    • 谨记文件路径:确保在正确的目录中执行命令,避免路径错误。
    • 参考资料:如有疑问,可参考官方文档或社区讨论,确保安装过程顺利进行。

    转载地址:http://gmvq.baihongyu.com/

    你可能感兴趣的文章
    OSG学习:场景图形管理(二)——单窗口多相机渲染
    查看>>
    OSG学习:场景图形管理(四)——多视图多窗口渲染
    查看>>
    OSG学习:新建C++/CLI工程并读取模型(C++/CLI)——根据OSG官方示例代码初步理解其方法
    查看>>
    Sql 随机更新一条数据返回更新数据的ID编号
    查看>>
    OSG学习:空间变换节点和开关节点示例
    查看>>
    OSG学习:纹理映射(一)——多重纹理映射
    查看>>
    OSG学习:纹理映射(七)——聚光灯
    查看>>
    OSG学习:纹理映射(三)——立方图纹理映射
    查看>>
    OSG学习:纹理映射(二)——一维/二维/简单立方图纹理映射
    查看>>
    OSG学习:纹理映射(五)——计算纹理坐标
    查看>>
    OSG学习:纹理映射(六)——灯光
    查看>>
    OSG学习:纹理映射(四)——三维纹理映射
    查看>>
    OSG:从源码看Viewer::run() 一
    查看>>
    OSI七层模型与TCP/IP四层与五层模型详解
    查看>>
    OSI七层模型的TCP/IP模型都有哪几层和他们的对应关系?
    查看>>
    OSM数据如何下载使用(地图数据篇.11)
    查看>>
    OSPF 四种设备角色:IR、ABR、BR、ASBR
    查看>>
    OSPF 学习
    查看>>
    OSPF 概念型问题
    查看>>
    SQL Server 存储过程分页。
    查看>>