grunt-requirejs - 如何优化CSS?

时间:2013-05-28 05:09:27

标签: css requirejs gruntjs yeoman

我正在使用Yeoman,并且正在尝试设置requirejs来优化我的CSS文件。

我在Gruntfile.js中有这个:

requirejs: {
  css: {
    options: {
      optimizeCss: 'standard',
      cssIn: 'app/styles/main.css',
      out: 'app/styles/main.min.css'
    }
  }
}

当我运行build命令时,我收到一个错误:

grunt build

Running "requirejs:css" (requirejs) task
>> Error: TypeError: new path must be a string
>>     at Object.fs.renameSync (fs.js:439:18)
Warning: Task "requirejs:css" failed

我不确定那里发生了什么,或者如何调试它。

有谁知道问题可能是什么?

1 个答案:

答案 0 :(得分:3)

没关系,我把它解决了。

与Yeoman一起提供的愚蠢的useminPrepare任务充满了grunt-requirejs配置。有点讨厌,尤其是因为我想要使用grunt-requirejs是因为我不喜欢usemin的工作方式。

<强>更新

这是我的配置:

//index.html:

<!-- build:js scripts/scripts.js -->
<script data-main="scripts/main" src="components/requirejs/require.js"></script>
<!-- endbuild -->


//Gruntfile.js:

requirejs: {
  js: {
    options: {
      baseUrl: '<%= yeoman.tmp %>/scripts',
      out: '<%= yeoman.dist %>/scripts/scripts.js',
      name: 'main',
      optimize: 'none',
      mainConfigFile: '<%= yeoman.app %>/scripts/main.js',
      useStrict: true,
      wrap: true
    }
  },
  css: {
    options: {
      optimizeCss: 'standard',
      cssIn: '<%= yeoman.app %>/styles/main.css',
      out: '<%= yeoman.dist %>/styles/main.css'
    }
  }
},
useminPrepare: {
  html: '<%= yeoman.app %>/index.html',
  options: {
    dest: '<%= yeoman.dist %>'
  }
},
usemin: {
  html: '<%= yeoman.dist %>/index.html',
  options: {
    dirs: ['<%= yeoman.dist %>']
  }
}

grunt.registerTask('build', [
  'requirejs:js',
  'requirejs:css',
  'useminPrepare', //must be after requirejs:css as it breaks its config params
  'usemin'
]);

注意:grunt-usemin中仍存在一个底层错误,它(错误地)尝试更改requirejs:css配置的requirejs配置。我reported that here