大家要善于利用瀏覽器為我們提供的config
Element 與 Console應(yīng)該是常見弟劲，并且我們調(diào)試的時候經(jīng)常使用踢代，然而其它每個都有極其重要的作用钦扭，
就像NetWork 我們做前后端交互的時候，都會根據(jù)NetWork返回的數(shù)據(jù)查看接口有什么問題凿菩，常見的問題是吧机杜，400，500這些狀態(tài)碼衅谷，方便我們找到問題并作出相應(yīng)的解決椒拗，這些小伙伴可以去查一下更大的用法，今天教大家使用Sources實(shí)現(xiàn)本地CSS熱更新获黔，其實(shí)用處不大蚀苛，主要是給學(xué)習(xí)CSS的朋友更好的測試，因?yàn)槲覀儫岣碌膶?shí)現(xiàn)一般都是需要在服務(wù)器環(huán)境中的
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Cache-Control" content="max-age=31536000">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="stylesheet" href="index.css"> =>引入css
</head>
<body>
我是會變色的fonts
</body>
</html>
css文件
body{
color: green
}
我們f12 打開控制臺 玷氏，調(diào)到Sources面板堵未，可以發(fā)現(xiàn)我們的資源文件
其實(shí)我們在這里是可以直接編輯的，而且已經(jīng)有熱更新了盏触，好比我們在Elements中的style中更改樣式一樣渗蟹，當(dāng)然我們不能在這里編輯块饺，而且刷新完全沒了
我們要給瀏覽器增加修改文件的權(quán)限，因?yàn)闉g覽器是沒有這些權(quán)限的雌芽，右鍵css文件授艰，選擇第一個選項，會出來一個文件選擇膘怕，把我們的編輯的文件夾選中即可
點(diǎn)擊允許
此時會有我們的包文件想诅，右鍵css 選擇Map 映射
選擇我們要編輯的css文件召庞，此時就可以在編輯器中實(shí)現(xiàn)熱更新了
