VScode怎么开启本地服务器及本地调试?

初入职场,接触不少新鲜的东西,从最初入门的工具是HBuilder,到现在逐渐熟悉的vscode,想记录下自己的成长,不想一边学着,一边忘着。想把自己接触到的东西都记录下来吧。有需要的小伙伴,也可以参考~

今天因为一些原因呢,要开启本地调试,以前用HBuilder打开本地的文件,你会发现文件的路径前面就会有localhost:端口号/路径名,HBuilder会自动开启本地服务,但是用vscode直接打开本地文件,你会发现它的路径是这个样子的:

然而,我又不想再重新装回HBuilder,于是我去百度自学了(百度是个好东西,哈哈,当然这只是在有些方面)

1、首先,如果我们想开启vscode的本地服务,首先在他的商店里找到Debugger for Chrome这个插件,点击安装,下图我已经安装好了,所以就没有安装俩字了。

2、接下来就是配置,图中我标了步骤,应该不难看懂吧,第三补是配置自己的文件路径,这个是要经常改动的,测试哪个文件就写上那个文件的名字就好,文件前面的${workspaceRoot}这个不需要变动,变动的是后面的,第四步下拉选择那个你需要开启本地服务的文件夹就好

3、接下来还要用npm安装一个包来开启本地服务器,使用ctrl+`快捷键打开终端,然后输入npm install -g live-server,出现红框标注的那个部分就说明安装成功了

4、然后在命令行里输入 live-server,浏览器就会自动打开你要调试的页面

扫描二维码关注公众号,回复: 11513510 查看本文章

然后想看哪个页面,自己点击那个就好了。


Error: listen EACCES 0.0.0.0:8080


这种情况一般是端口被占用,如果本地不用VS的话,可以释放端口,方法

NT kernel & System 占用占用80端口
问题:

1 运行'netstat -ano'发现80端口被pid=4的进程占用

2 打开任务管理器,发现pid=4的进程,其实是system进程,其对应的进程描述是NT kernel & system。

如何清除:

解决方法:

http协议里的某个进程占用了80,但是在任务管理器显示的是System,最后发现是http协议的某个进程占用(发现的过程也是在网上搜索得知道,这个进程显式停止是无法停止的,只有在cmd.exe里使用net stop http来停止

1、打开cmd

2、运行net stop http

3、按y 确定

(显示HTTP服务无法停止,使用管理员方式再试试,还是无法停止,先不管)

4. Sc config http start= disabled

  

5、重启

6、测试,PID4还是启动的。但是80已经不被占用了。发现445端口被PID4 占用的。

试验方法二:

1、打开regedit

1)找到HKEY_LOCAL_MACHINE目录

2)找到System

3)找到CurrentControlSet

4)找到Services

5)找到http

6)右边栏:找到start

7)打开,将3改为4,确定

8、重启电脑,就解除了NT Kernel & System占用80端口,如果要使用vs能够正常运行,则反过来把4改成3即可。

(测试不行啊,重启端口还是被占,什么变化都没有)

如果本地安装VS的话,释放端口会导致VS不能正常运行,所以此时要修改默认端口8080,live-server的配置文件里面有个index.js文件


修改完成之后,运行命令:

E:\vue\code1117>live-server
Serving "E:\vue\code1117" at http://127.0.0.1:7999
Ready for changes
GET /favicon.ico 404 5.152 ms - 24
 

猜你喜欢

转载自blog.csdn.net/qq_40999917/article/details/107385711
今日推荐