Question

我对咕噜几乎是全新的。我使用了带引导程序3.1.1的grunt，而grunt watch - 命令运行得很好。我的bootstrap.min.css文件每次都被编译。（我上传我的bootstrap.min.css）

后来我丢失了我的3.1.1 grunt文件（长话短说我的电脑崩溃了）。所以现在使用Bootstrap 3.2.0，我将重建我的工作流程。

但现在当我使用grunt watch时，我只会编译“bootstrap.css”和“bootstrap.theme.css”。

我花了最后几个小时才弄明白这一点。

我想要什么 我希望grunt watch编译缩小的“bootstrap.min.css” 那么如何调用watch上的min.css函数？

我很乐意得到一些帮助。

Answer 1

Grunt watch只会观看文件，然后运行您设置的任务。我在你的gruntfile中假设你有这样的东西：

css: {
    files: [
      'bootstrap.css',
    ],
    tasks: ['less'],
  },

在较少的任务中你应该有类似下面的东西。请注意cleancss选项设置为true：

options: {
      cleancss: true
    },

    files: {
      "dest/bootstrap.min.css": "src/bootstrap.css",
      "dest/bootstrap.theme.min.css": "src/bootstrap.theme.css"
    }

<强>更新

根据您上传的文件，您应该在触发手表时运行cssmin:core任务。

更新2： 要更新监视任务，您只需将cssmin：core任务添加到less子任务：

less: {
        files: 'less/**/*.less',
        tasks: ['less', 'cssmin:core]
      }

在这里，您告诉它运行较少的任务，然后在观看时更改较少的文件之一时执行cssmin任务。

Answer 2

你的gruntfile.js将有一个'watch'部分，如下所示

    watch: {
      src: {
        files: '<%= jshint.core.src %>',
        tasks: ['jshint:src', 'qunit', 'concat']
      },
      test: {
        files: '<%= jshint.test.src %>',
        tasks: ['jshint:test', 'qunit']
      },
      less: {
        files: 'less/**/*.less',
        tasks: 'less'
      }
    },

less subsection下的任务定义了'grunt watch'将运行的任务。在Bootstrap 3.3.2中（我猜在3.1.1中它也是一样的）是'cssmin'任务，它缩小了核心引导程序css。因此，您需要将任务添加到较少，以便上面的代码变为

    watch: {
      src: {
        files: '<%= jshint.core.src %>',
        tasks: ['jshint:src', 'qunit', 'concat']
      },
      test: {
        files: '<%= jshint.test.src %>',
        tasks: ['jshint:test', 'qunit']
      },
      less: {
        files: 'less/**/*.less',
        tasks: ['less', 'cssmin']
      }
    },

Answer 3

以上都不适合我。看起来css minification命令已更改为cssmin:minifyCore，因此我已将监视任务更新为以下内容：

watch: {
  src: {
    files: '<%= jshint.core.src %>',
    tasks: ['jshint:core', 'qunit', 'concat']
  },
  test: {
    files: '<%= jshint.test.src %>',
    tasks: ['jshint:test', 'qunit']
  },
  less: {
    files: 'less/**/*.less',
    tasks: ['less', 'cssmin:minifyCore']
  }
},

希望这有助于其他人！

Bootstrap“grunt watch”不会创建bootstrap.min.css

3 个答案: