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. 关于vc工程包含多个lib库老是提示无法打开问题

    在一个VC项目中,我要包含五个lib库,我在连接器->常规->附加库目录中输入了正确的库包含路径,然后再连接器->输入->附加依赖项中输入:ws2_32.lib;wsock32 ...

  2. codeforces水题100道 第七题 Codeforces Round #270 A. Design Tutorial: Learn from Math (math)

    题目链接:http://www.codeforces.com/problemset/problem/472/A题意:给你一个数n,将n表示为两个合数(即非素数)的和.C++代码: #include & ...

  3. 关于RabbitMQ交换机的理解

    RabbitMQ是实现AMQP(高级消息队列协议)的消息中间件的一种,最初起源于金融系统,用于在分布式系统中存储转发消息,在易用性.扩展性.高可用性等方面表现不俗.消息中间件主要用于组件之间的解耦,消 ...

  4. drizzleDumper的原理分析和使用说明

    https://blog.csdn.net/qq1084283172/article/details/53561622 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog. ...

  5. django restframwork 教程之authentication权限

    当前我们的API在编辑或者删除的时候没有任何限制,我们不希望有些人有高级的行为,确保: 代码段始终与创建者相关联 只允许授权的用户可以创建代码段 只允许代码段创建者可以更新和删除 没有认证的请求应该有 ...

  6. Delphi 10 Seattle 小票打印控件TQ_Printer

    TQ_Printrer控件,是一个为方便需要控制打印命令而设计的跨平台专用控件,已包含标准ESC/POS打印控制的基本指令在内(这些基本指令已能很好的满足多数项目使用). TQ_Printrer控件让 ...

  7. 转载>>六款大数据采集平台的架构分析

    随着大数据越来越被重视,数据采集的挑战变的尤为突出.今天为大家介绍几款数据采集平台: Apache Flume Fluentd Logstash Chukwa Scribe Splunk Forwar ...

  8. Ubuntu Releases 版本下载站

    http://releases.ubuntu.com/

  9. 二手回收能否翻过BAT这座大山?

    自2015年几大合并事件后,互联网江山基本都归于BAT三家.即便近日战火熊熊的本地生活和外卖也都是百度.阿里和腾讯的家门事.创业浪潮在2015年疯狂过后,留给下一年的风口似乎不多了. 不过有媒体预测智 ...

  10. 2.4scope

    name_scope variable_scope scope (name_scope/variable_scope) from __future__ import print_function im ...