Question

我已经使用

安装了Foundation 5

>gem install foundation

然后使用命令

创建一个新项目

>foundation scratch --libsass

主要原因是我在Windows上，我真的不需要/想要使用指南针。我知道在我更改了我可以运行的sass文件之后

>grunt build

为了从我对.scss文件所做的更改中更新我的css文件。一切正常。

问题：我是否有办法观看这些.scss文件，以便每次保存文件时都不必运行该命令。有点像我和>compass watch一样吗？ package.json中有一个名为grunt-contrib-watch的开发依赖项是什么？如果是这样，我该如何使用它？

以下是安装完成后的Gruntfile：

module.exports = function(grunt) {
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    sass: {
      options: {
        includePaths: ['bower_components/foundation/scss']
      },
      dist: {
        options: {
          outputStyle: 'compressed',
          sourceMap: true,
        },
        files: {
          'css/app.css': 'scss/app.scss'
        }
      }
    },

    watch: {
      grunt: {
        options: {
          reload: true
        },
        files: ['Gruntfile.js']
      },

      sass: {
        files: 'scss/**/*.scss',
        tasks: ['sass']
      }
    }
  });

  grunt.loadNpmTasks('grunt-sass');
  grunt.loadNpmTasks('grunt-contrib-watch');

  grunt.registerTask('build', ['sass']);
  grunt.registerTask('default', ['build','watch']);
}

如果有人可以提供帮助，请提前致谢！

Answer 1

好的，所以我做了一些调查并查看了咕噜咕噜的文件，即使我用咕噜咕噜咕噜咕噜咕噜咕噜咕噜咕噜咕噜咕：

watch: {
    grunt: {
        options: {
            reload: true
        },
        files: ['Gruntfile.js']
    },

    sass: {
        files: 'scss/**/*.scss',
        tasks: ['sass']
    }
}

有了这个，我以为我可以跑：

>grunt watch

我知道，我可能不是最流行的工具，但我是新手，并没有意识到当我以这种方式安装Foundation时它也安装了这个grunt-contrib-watch依赖项。对不起，如果这个问题太明显了，也许会帮助别人，因为我很难找到答案，即使它在package.json中我也不习惯使用。

当使用Libsass / Grunt时，有没有办法即时观看文件？

1 个答案: