為啥我的chrome瀏覽器不能像老師一樣更改scss文件
是不是哪里設(shè)置問(wèn)題
熬嗚
2015-10-31
3 回答
舉報(bào)
0/150
提交
取消
2016-11-21
1.在 chrome://flags/ 中啟用 Developer Tools Experiments (開(kāi)發(fā)者工具實(shí)驗(yàn))
2.在 Developer tools 設(shè)置 Experiments 選項(xiàng)下開(kāi)啟File system folders in Sources Panel，再重啟Developer tools，就會(huì)多出Workspace選項(xiàng)。
3.在Workspace中把你的資源目錄添加到File systems即可，如果CSS，JS鏈的是URL可以使用Mappings來(lái)設(shè)置路由（注意:結(jié)尾千萬(wàn)不要加上\，他邏輯只判斷了是否以/結(jié)尾，否則就會(huì)變成path\/,略坑啊~~）
4. 需要安裝2個(gè)插接件：grunt-contrib-watch、connect-livereload
⑴執(zhí)行命令：npm install --save-dev grunt-contrib-watch connect-livereload
⑵. 安裝瀏覽器插件：Chrome LiveReload
⑶. 配置一個(gè)Web服務(wù)器（IIS/Apache），LiveReload需要在本地服務(wù)器環(huán)境下運(yùn)行（對(duì)file:///文件路徑支持并不是很好），需要127.0.0.1:8080這種的。
⑷. 修改Gruntfile.js文件：
watch: {
? ? ? ? ? ?css: {
? ? ? ? ? ? ? ?files: '**/*.scss',
? ? ? ? ? ? ? ?tasks: ['sass'],
? ? ? ? ? ? ? ?options: {
? ? ? ? ?livereload: true
? ? ? ? ? ?}
? ? ? ? ? ? ? ? }
? ? ? ?}
2016-10-14
找到了，在chrome://flags/ 勾選
2015-12-17
chorme需要在“chrome://flags/”里面啟用Developer Tools Experiments (開(kāi)發(fā)者工具實(shí)驗(yàn))