禁用Grunt（Yeoman）中的文件压缩

Question

我最近开始使用Yeoman中的GruntJS，我很喜欢JavaScript代码压缩的想法，但在开发过程中它会带来一些困难。我尝试在Gruntfile中以不同的组合禁用uglify、usemin等，但似乎每个东西都依赖于另一个东西并且破坏了整个流程。有没有简单的方法来禁用代码压缩？我正在使用到目前为止Yeoman提供的最新版本的Grunt，我发现旧的解决方案与Yeoman所使用的Gruntfile设置不同。

以下是我的Gruntfile：

// Reads HTML for usemin blocks to enable smart builds that automatically
// concat, minify and revision files. Creates configurations in memory so
// additional tasks can operate on them
useminPrepare: {
  options: {
    dest: '<%= config.dist %>'
  },
  html: '<%= config.app %>/index.html'
},

http://hastebin.com/gicabukojo.js

- frazras

---

是的，仍然有一个Gruntfile，但我在uglify的注释中看到了这个内容：//默认情况下，您的“index.html”的<!-- Usemin block -->将负责缩小。如果您不希望使用Usemin块，则已预先配置这些选项。// uglify: {...请参见添加的Gruntfile。 - frazras

请在你的问题中包含 grunt 文件的相关部分 - 问题应该是自包含的。 - Ryley

我包含了整个Gruntfile的链接，因为我完全不知道哪部分Gruntfile是必需的来禁用缩小。我对下票感到惊讶，因为我想在开发过程中禁用缩小应该是一个常见的要求，只是我无法弄清楚如何做。我想它发生在Gruntfile的某个地方，所以我包含了整个文件的链接。 如果这不是stackoverflow类型的问题，请在我的下一个downvote之前说出原因，这样我就可以解决这个问题了:-/ - frazras

阅读Ryley的评论以了解为什么您被投票否决。这与您所问的问题无关，而是与您提问的方式有关。此外，我查看了您发布的gruntfile。为什么您不能在HTML文件中删除“<!-- Usemin block -->”注释呢？ - jperezov

@fazras 为了让其他人在浏览此页面时更有用，你能否更新你的问题并附上 gruntfile 的相关部分？我会在回答中提到它。 - jperezov

Answer 1

我需要调整 usemin 的 flow: 选项：

根据 yeoman grunt usemin 的完美手册，默认的 flow: 是

{ steps: { js: ['concat', 'uglify'], css: ['concat', 'cssmin'] }, post: {} }

这里是我如何修改 yo webapp 的 Gruntfile.js 文件以从流程中删除 uglify 的要点。

- Brian Tingle

---

非常好，谢谢！ - JCraine

Answer 2

这个注释块在你的Gruntfile中：

// By default, your `index.html`'s <!-- Usemin block --> will take care
// of minification. These next options are pre-configured if you do not
// wish to use the Usemin blocks.

基于此，从您的index.html文件中删除<!-- Usemin block -->应该可以防止useminPrepare grunt任务对您的javascript进行缩小。

此外，您可以编辑uglify任务以创建新文件，通过在文件扩展名中添加.min来避免覆盖dev文件：

 uglify: {
   dist: {
     files: {
       '<%= config.dist %>/scripts/scripts.js': [
         '<%= config.dist %>/scripts/scripts.min.js'
       ]
     }
   }
 },

- jperezov

---

但是如果您的index.html中没有<!-- Usemin block -->标记，该怎么办？ - Sebastian Hernandez

@SebastianHernandez 所谓的 <!-- Usemin block --> 是指在 app/index.html 中以 <!-- build:js 或 <!-- build:css 开头的行；请参阅 https://github.com/yeoman/grunt-usemin#blocks。 - Brian Tingle