Vue开发环境搭建,Vue.js安装,浏览器辅助工具Vue-devtools

作为开发者,知道开发工具的搭建是必要的,一定要敢于去吸收新的知识,过程可能会很痛苦,但收获也是等价的

1.首先我们进入Vue官网:hthttps://cn.vuejs.or

点击学习——>安装

2. 我们选择开发版本,点击下载;因为开发版本包含完整的警告和调试模式,适合初学者。

 

3. 下载浏览器辅助工具,由于官网提供的Vue-devtools地址在国外,所以我们使用国内的gitee码云,第一次使用应该需要注册。注册界面是这个,个人空间地址使用一个独一无二的。

 

网址:克隆gitee:Zhao/devtools下载安装包(选择HTTPS)

因为dev和master分支没有了,所以现在选择devtools-add-remote-devtools分支

4. 下载好后,进入到解压后的devtools-add-remote-devtools包中,复制路径

 5.以管理员身份打开cmd窗口执行   npm i ,这里必须是管理员身份,否则可能会出现权限不够报错。

6. 然后执行npm run build。

 

7.打开谷歌浏览器,找更多工具-->扩展程序-->加载已解压的扩展程序

打开开发者模式,点击加载已解压的扩展程序,接着找到刚才解压的文件夹 ,目录层级为:devtools-add-remote-devtools-->shells-->chrome。

 

8.编写一个Vue程序,测试一下

 9.运行在谷歌浏览器

 点击Root

 搭建完成啦!开始你的Vue之旅吧!


版权声明:本文为xiaominxiaohui原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。