我从另一个dev开始使用现有的项目,并且正在使用SCSS,但另一个dev用于使用CodeKit在本地(而不是在服务器上)编译CSS文件。
我有一个源地图可用,所以我的问题是..我如何使用这个源地图并使用它来设置一个任务来自动监视和编译.SCSS到.CSS文件(我猜是使用Grunt?)
以下是源地图的相关部分:
"sources": ["frontend.scss","../../../../../../Library/Ruby/Gems/1.8/gems/compass-core-1.0.0.alpha.19/stylesheets/compass/reset/_utilities.scss","../../../../../../Volumes/Datas/Sites/smashy/hashtag/hashtag/www/app/assets/scss/_bootstrapgrid.scss","../../../../../../Volumes/Datas/Sites/smashy/hashtag/hashtag/www/app/assets/libraries/font-awesome/_path.scss","../../../../../../Volumes/Datas/Sites/smashy/hashtag/hashtag/www/app/assets/libraries/font-awesome/_core.scss","../../../../../../Volumes/Datas/Sites/smashy/hashtag/hashtag/www/app/assets/libraries/font-awesome/_larger.scss","../../../../../../Volumes/Datas/Sites/smashy/hashtag/hashtag/www/app/assets/libraries/font-awesome/_fixed-width.scss","../../../../../../Volumes/Datas/Sites/smashy/hashtag/hashtag/www/app/assets/libraries/font-awesome/_list.scss","../../../../../../Volumes/Datas/Sites/smashy/hashtag/hashtag/www/app/assets/libraries/font-awesome/_variables.scss","../../../../../../Volumes/Datas/Sites/smashy/hashtag/hashtag/www/app/assets/libraries/font-awesome/_bordered-pulled.scss","../../../../../../Volumes/Datas/Sites/smashy/hashtag/hashtag/www/app/assets/libraries/font-awesome/_spinning.scss","../../../../../../Volumes/Datas/Sites/smashy/hashtag/hashtag/www/app/assets/libraries/font-awesome/_rotated-flipped.scss","../../../../../../Volumes/Datas/Sites/smashy/hashtag/hashtag/www/app/assets/libraries/font-awesome/_mixins.scss","../../../../../../Volumes/Datas/Sites/smashy/hashtag/hashtag/www/app/assets/libraries/font-awesome/_stacked.scss","../../../../../../Volumes/Datas/Sites/smashy/hashtag/hashtag/www/app/assets/libraries/font-awesome/_icons.scss","../../../../../../Library/Ruby/Gems/1.8/gems/compass-core-1.0.0.alpha.19/stylesheets/compass/_support.scss","../../../../../../Library/Ruby/Gems/1.8/gems/compass-core-1.0.0.alpha.19/stylesheets/compass/css3/_border-radius.scss","../../../../../../Library/Ruby/Gems/1.8/gems/compass-core-1.0.0.alpha.19/stylesheets/compass/utilities/general/_clearfix.scss","../../../../../../Library/Ruby/Gems/1.8/gems/compass-core-1.0.0.alpha.19/stylesheets/compass/utilities/general/_hacks.scss","../../../../../../Library/Ruby/Gems/1.8/gems/compass-core-1.0.0.alpha.19/stylesheets/compass/css3/_box-sizing.scss","../../../../../../Library/Ruby/Gems/1.8/gems/compass-core-1.0.0.alpha.19/stylesheets/compass/css3/_transition.scss","../../../../../../Library/Ruby/Gems/1.8/gems/compass-core-1.0.0.alpha.19/stylesheets/compass/css3/_opacity.scss","../../../../../../Library/Ruby/Gems/1.8/gems/compass-core-1.0.0.alpha.19/stylesheets/compass/css3/_transform.scss"],
"names": [],
"file": "frontend.css"
答案 0 :(得分:0)
正如您所提到的,您需要检查源图文件以确定原始SCSS文件。
然后你需要设置2个grunt任务(或者你可以使用Gulp):
互联网上有很多关于这个主题的教程,例如: http://ryanchristiani.com/getting-started-with-grunt-and-sass/
确保编辑watch和sass任务中的源文件以反映您的实际文件。