vue之调试工具DevTools

vue之调试工具DevTools,第1张

1.创建一个空文件夹(我命名为vue devtools),

2.进入这个文件夹按住 shift + 右键 选择进入在此处打开powershell 窗口,就可以进入这个文件的终端

3.在终端输入 npm install vue-devtools

完成后,进入该文件下的node_modules 文件,找到 vue-devtools 文件,进入其中,将vender 文件拖至谷歌浏览器的扩展程序中即可。

进入verder下的 manifest.json ,修改persistent 为 true, 保存。

刷新浏览器扩展程序即可使用。运行vue程序,即可在控制台中看到此调试工具。

vue devtools 在用vue做的网站上会变亮但不能查看其结构。只有在本地运行的项目才能查看。

资料参考: https://blog.csdn.net/qq_44210926/article/details/106161483

为了让一些不太清楚搭建前端项目的小白,更快上手。今天我将一步一步带领你们进行前端项目的搭建。前端开发中需要用到框架,那vue作为三大框架主流之一,在工作中很常用。所以就以vue为例。

下载并安装node

下载地址为:https://nodejs.org/en/

在 nodejs官网下载最新版稳定版的node.js安装,自带了npm工具 ,推荐下载左边的。

检查node是否安装成功

为了更快安装,可以使用淘宝的镜像:http://npm.taobao.org/

在终端输入以下命令:

检测cnpm是否安装成功

vue-cli是vue脚手架工具,方便打包,部署,测试等。

进入你的项目目录,创建一个基于 webpack 模板的新项目: vue init webpack 项目名

进入项目

安装依赖

此时项目中会多了一个node_modules

启动成功


欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/yw/8060536.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-13
下一篇 2023-04-13

发表评论

登录后才能评论

评论列表(0条)

保存