首页 > 其他分享 >(谷歌浏览器)如何在vscode中搭建vue.js devtools的环境

(谷歌浏览器)如何在vscode中搭建vue.js devtools的环境

时间:2024-04-04 20:32:15浏览次数:27  
标签:插件 vue vscode js 点击 Vue

搭建过程中明明所有操作步骤都做了,却还是出现下面这种情况:

 以下是正确的搭建操作步骤:

根据一下图片在vscode中创建文件夹;

将以下代码写入;

  <script type="text/javascript" src="../js/vue.js"></script>

接下来就是我们需要点击https://vuejs.zcopy.site/,进入到网站后,点击学习-教程;

点击安装,然后就会看到开发版本和生产版本;

分别点击开发版本和生产版本,将它们的代码分别复制到在vscode中的vue.js和vue.min.js中;

运行01_初始vue.html,会出现下面所显示的错误,是因为我们的插件还未添加到谷歌浏览器的拓展程序里;

插件放在下面啦!!!

链接:https://pan.baidu.com/s/1HMp-PGk5TNNK5jSSlZqvYA?pwd=fto7 
提取码:fto7

将解压后的插件添加到谷歌浏览器的扩展程序中,然后刷新网页,点击F12查看情况;

输入Vue和Vue.config看是否出现下面情况;

该默认值的代码如下,同时写了一个小案例测试:

将图片里的代码写入,运行;

点击Vue,看是否出现下面这种;

就算搭建成功了!!!

标签:插件,vue,vscode,js,点击,Vue
From: https://blog.csdn.net/m0_73581733/article/details/137376822

相关文章

  • vue axios sessionID 每次请求都不同的解决方式
    前端:        后端:注意:配置 allowedOrigins时,如果写的是http://localhost/,而请求的源地址是127.0.0.1。虽然它们通常指向同一台本地计算机,但在CORS规则中被视为不同的源。需更新更新allowedOrigins列表,将现有条目http://localhost:5174替换为http://127.......
  • Java登陆第三十七天——VUE3响应式基础、条件渲染、列表渲染
    响应式数据什么是响应式数据? 当数据发生改变时,DOM树的内容,会和数据同步更新。 vue3不是自动响应式数据,需要经过函数处理得到响应式数据对象。ref和reactive这两个函数都会返回响应式数据对象,但也有不同。refref通常用于将一个基本类型转为响应式数据对象。基本类型包括:数......
  • Vue基础知识:声明式导航---导航链接router-link,router-link是什么,怎么用?router-link-ac
    router-link是什么?vue-router提供的一个全局组件,router-link(用于取代a标签)router-link怎么用?router-link的好处?1.能够跳转,能高亮(自带激活时的类名)1.能跳转,配置to属性指定路径(必须)。本质还是a标签,to不需要多加#既然已经有了a标签,为什么还有加一个router-link标签呢?......
  • 基于ssm网上医院预约挂号系统+jsp论文
    摘要如今的信息时代,对信息的共享性,信息的流通性有着较高要求,因此传统管理方式就不适合。为了让医院预约挂号信息的管理模式进行升级,也为了更好的维护医院预约挂号信息,网上医院预约挂号系统的开发运用就显得很有必要。并且通过开发网上医院预约挂号系统,不仅可以让所学的SSM......
  • 元素拖拽?一个vue指令搞定
    说在前面......
  • 约跑小程序源码(asp.net+vue+element++uniapp+sqlserver)
    开发语言:c#框架:后端asp.netmvcpc管理页面:vue+element数据库:sqlserver开发软件:eclipse/myeclipse/idea浏览器:谷歌浏览器小程序框架:uniapp小程序开发软件:HBuilderX一、前言介绍   约跑小程序是一个小程序。用户跑步可以用宜刻小程序进行记录打卡,也可以选择和其他......
  • 解决 WebStorm 粘贴 JSX 时自动将 class 改为 className 的问题
    参考:解决复制时class自动改为className的问题将该选项取消勾选:File=>Settings=>Editor=>General=>SmartKeys=>JavaScript=>ConvertHTMLwhenpastingintoJSXfiles。......
  • node.js启动文件服务器 并自动查询index.html等默认文件
    方法1'usestrict';consthttp=require('http'),fs=require('fs'),url=require('url'),path=require('path');//从命令行参数获取root目录,默认是当前目录varroot=path.resolve(process.argv[2]||'.&......
  • wamp/xammp医院预约挂号病历管理系统PHP+vue_snsj0
     医院病历管理系统主要有管理员,用户和医生三个功能模块。以下将对这三个功能的作用进行详细的剖析。本论文将对医院病历管理系统相关的技术以及网站开发技术进行分析和研究,在深入了解医院病历管理的过程以及合格要求后,结合用户的实际情况,研究医院病历管理系统的设计与实现,期望......
  • 【python学习过程--day1】认识python及其开发工具:VScode和pycharm的安装和激活
    认识python        Python是一种高级、通用、解释型编程语言,由GuidovanRossum在1980年代末和1990年代初设计开发的。它具有简洁清晰的语法和强大的标准库,因此被广泛用于Web开发、科学计算、人工智能、数据分析、系统自动化等领域。Python的设计哲学强调代码的可读性......