compass不生成maps文件,所载调试css上,极不方便。看到下图的调试方式,怎么做。

利用用koala来解决,具体步骤如下:

1.确保自己安装了ruby和sass,compass。接着安装 compass-sourcemaps

gem install compass-sourcemaps --pre

2.安装koala,安装完成打开设置

3.在config.rb文件添加下列一段代码

# enable sourcemaps
enable_sourcemaps = true
sass_options = {:sourcemap => true}

4.开启chrome的开发者工具(F12)-> settings -> preference(首选项意思)

ps: koala 是一种前端能转义的工具,当然现在都在使用webpack,gulp,grunt等其他打包软件,但是这些打包软件,都需要写配置,明明就是简单活动页面,另外你也不想再自己的编辑器上装各种sass转css插件,所以koala提供很大方便。

compass利用koala在chrome开启scss调试的更多相关文章

  1. 利用ChromeCROSS可以在chrome浏览器上调试跨域代码

    利用ChromeCROSS可以在chrome浏览器上调试跨域代码 1.下载ChromeCROSS文件,可百度下载,或者在我的百度云上下载:链接: https://pan.baidu.com/s/10_ ...

  2. Chrome控制台 JS调试

    Chrome控制台 JS调试的一些小技巧 $ $_命令返回最近一次表达式执行的结果,功能跟按向上的方向键再回车是一样的,但它可以做为一个变量使用在你接下来的表达式中. $0~$4则代表了最近5个你选择 ...

  3. Chrome浏览器及调试教程

    ==>(微信公众号:IT知更鸟)欢迎关注<^>@<^> Chrome浏览器及调试教程 在web开发过程中,我们在写JavaScript脚本时难免会遇到各种bug,这时,我 ...

  4. 使用Chrome开发者工具调试Android端内网页(微信,QQ,UC,App内嵌页等)

    使用Chrome开发者工具调试Android端内网页(微信,QQ,UC,App内嵌页等) 前言 移动端页面调试一直是好多朋友头疼的问题,iOS 由于其封闭的特性和整体较高的性能,整体适配相对好做,调试 ...

  5. Chrome浏览器如何调试移动端网页信息

    Chrome浏览器如何调试移动端网页信息 2017年08月12日 12:42:20 阅读数:835 最近在弄项目,用WebView加载一个页面,想追踪页面中一个按钮的点击事件.这个可能就需要调试这个页 ...

  6. chrome inspect 远程调试H5

    chrome://inspect/#devices 一个内置于chrome的远程调试指令,满足远程调试的几个必须条件 1,能够访问https://chrome-devtools-frontend.ap ...

  7. 使用Chrome DevTools直接调试Node.js与JavaScript(并行)

    Good News: 现在我们可以用浏览器调试node.js了!!! 前提 Node.js 6.3+, 这个可上Node.js官网自行下载: Chrome 55+. 如果您本地的chrome升级到最新 ...

  8. Chrome安卓H5调试,连接手机检测不到页面

    Chrome安卓H5调试,连接手机检测不到页面,重启什么的都不行,未找到设备,或者offline,怎么办? 首先手机开启调试模式是必须的 然后用adb工具箱,cmd进来 运行命令 adb kill-s ...

  9. 利用Jemalloc进行内存泄漏的调试

    内存不符预期的不断上涨,可能的原因是内存泄漏,例如new出来的对象未进行delete就重新进行复制,使得之前分配的内存块被悬空,应用程序没办法访问到那部分内存,并且也没有办法释放:在C++中,STL容 ...

随机推荐

  1. Linux man 命令

    man命令可以用来查看Linux命令的帮助信息 .配置文件的帮助信息等等,通过不同的代号可以查看不同的帮助信息: 代号 含义 1 查看Linux命令的帮助信息(默认) 2 查看内核提供的函数的帮助信息 ...

  2. CentOS7--TigerVNC

    --安装服务yum install tigervnc-server -y --配置文件,多个用户就拷贝多个cp /lib/systemd/system/vncserver@.service /etc/ ...

  3. Fragment切换问题

    片断一: add hind @Overridepublic void onCheckedChanged(RadioGroup group, int checkedId) { switch (check ...

  4. codeforces水题100道 第二十四题 Codeforces Beta Round #85 (Div. 2 Only) A. Petya and Strings (strings)

    题目链接:http://www.codeforces.com/problemset/problem/112/A题意:忽略大小写,比较两个字符串字典序大小.C++代码: #include <cst ...

  5. windos或linux中 which命令 查看当前要执行的命令所在的路径

    whereis 用来查看一个命令或者文件所在的绝对路径,而 which 用来查看当前要执行的命令所在的路径. 下面举个例子来说明.加入你的linux系统上装了多个版本的java.如果你直接在命令行敲命 ...

  6. 【SPMF开源数据挖掘平台入门】MaxSP算法使用说明

    前段时间,由于项目中用到了序列挖掘的算法,师兄推荐我用用SPMF.在此做个记录. 首先简单介绍一下SPMF: SPMF是一个采用Java开发的开源数据挖掘平台. 它提供了51种数据挖掘算法实现,用于: ...

  7. android include标签的使用,在RelativeLayout中使用include标签需注意!!!!!

    转:http://4265337.blog.163.com/blog/static/195375820127935731114/ include和merge标记的作用主要是为了解决layout的重用问 ...

  8. java(9)并发编程

    整理自<java 并发编程的艺术> 1. 上下文切换 即使是单核处理器也支持多线程执行代码,CPU通过给每个线程分配CPU时间片来实现这个机制.时间片是CPU分配给各个线程的时间,因为时间 ...

  9. HashRouter与BrowserRouter的异同

    项目中控制路由跳转使用的是BrowserRouter 在开发过程中使用是没有问题的,但是将页面上传至服务器之后,问题就来了:用户访问的资源不存在,页面是空白的. 原因: 在browserHistory ...

  10. sort与asort与ksort区别

    sort只依据值从小到大排序,键值不参与排序 asort依据值排序,键值参与排序 ksort依据键值排序,值参与排序 sort只依据值从小到大排序,键值不参与排序. 例 <?php $arr=a ...