如何使用grunt htmlmin插件最小化html? [英] how to minify html with grunt htmlmin plugin?

问题描述

我用yeoman生成了一个有角度的应用程序，现在尝试用grunt + htmlmin缩小我的html文件. htmlmin看起来像这样:

I have generated a angular app with yeoman and now trying to minify my html files with grunt + htmlmin. The htmlmin bit looks like this:

  htmlmin: {
            dist: {
                options: {
                    collapseWhitespace: true,
                    conservativeCollapse: true,
                    collapseBooleanAttributes: true,
                    removeCommentsFromCDATA: true
                },
                files: [{
                    expand: true,
                    cwd: '<%= yeoman.dist %>',
                    src: ['*.html'],
                    dest: '<%= yeoman.dist %>'
                }]
            }
        },

当我运行此任务时，它响应说它缩小了2个文件，但在dist文件夹中看不到它们?根本没有创建任何视图文件夹吗?

When I run this task then it responds that it has minified 2 files but I cant see them in the dist folder? There is no view folder created at all?

推荐答案

我不使用yeoman，但我使用了Gruntjs.

I don't use yeoman, but I do use Gruntjs.

假设这不是yeoman配置问题，您可以执行与我类似的操作.这是要点...

Assuming it's not a yeoman config issue, you can do something similar to what I do. Here is the gist...

首先，我创建了一个开发过程，该过程不会丑化，缩小或其他任何事情……这有助于加快我的开发过程.

First I have a development process I've created that does not uglify, minify, or anything else... this helps speed up my dev process.

然后，当我准备发布时，我将通过一个包括uglify，concats，minify，imagemin等的发布过程来运行它.

Then when I'm ready to publish I run it through a publish process that includes uglify, concats, minify, imagemin, etc...

您实际上只需要最小化构建(输出)目录中的html ...，并且由于您正在发布，因此也可以只使用htmlmin版本覆盖build目录中的HTML文件(实际上是没有意义的)有两个版本都可以发布).

You really only need to minify the html from the build (output) directory... and since you're publishing you might as well just overwrite the HTML files in the build directory with the htmlmin versions (there is really no sense in having both versions for publishing).

这是我的任务...在这种情况下，假设您的输出目录名为"_build".这实际上是一个非常简单和干净的任务.希望这会有所帮助...

Here is my task to do that... for this case let's assume your output directory is named "_build". It's actually a very easy and clean task. Hope this helps...

htmlmin: {
    site: {
        options: {
            removeComments: true,
            collapseWhitespace: true,
            removeEmptyAttributes: false,
            removeCommentsFromCDATA: false,
            removeRedundantAttributes: false,
            collapseBooleanAttributes: false
        },
        expand: true,
        src: './_build/**/*.html',
    }
}

您无法htmlmin尚不存在的内容.您必须先构建输出目录，然后在这些文件上运行htmlmin ...我认为您的src也将更像以下内容...

You can't htmlmin something that doesn't exist yet. You have to build the output directory first and then run htmlmin on those files... I think your src will be more like the following as well...

files: [{
    expand: true,
    src: '<%= yeoman.dist %>/**/*.html'
}]

如果这对您有用，请对我的答案进行投票，并将其标记为正确答案.

If this works for you, then please vote-up my answer and mark it as the correct answer.

这篇关于如何使用grunt htmlmin插件最小化html?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！