谷歌浏览器的前端代码调试

在Javaweb的开发中后端的调试我们在后端代码打断点，debug运行即可，但是前端的调试又应该如何进行呢？

前端代码调试在入门的时候我使用过如下的几种方法：

1、在代码中写入alter

2、在代码中写入console.log，在控制台输出

但是两种方法都并不能说是正经的调试，具体算是什么我也不知道该怎么定义。前端代码的调试在我们今天的文章中说的主要是代码时在本地运行的，在本地运行的情况下我们前端的调试可以是在浏览器（Google Chrome)中的也可以是在开发工具中的，今天我们主要说的是在浏览器中打断点的。

代码要能被调试的前置条件是浏览器可以请求到代码，也就是说静态资源的权限项目是放开了的，这时候进行调试分为如下几步：

1、在开发工具（IDEA）中启动项目的时候要以Debug的模式启动

2、项目启动后在浏览器显示的页面中F12进入开发者模式
3、点击Source，在Page下面找我们的需要的代码文件，如果找到的当然好，找不到的话看第四步

4、点击FileSystem引入需要的文件

有时候由于浏览器设置的原因，在点击添加后会出现一个请求访问对应目录的请求框，这时候只需要点击确认即可，如果要是弹出的迟或是你自己忽略了，就也会造成引入不成功