9

例如:我uglify在我的 Gruntfile 中使用下面的当前配置到我的 JS 脚本:

    uglify: {
        options: {
            report: "min", //"gzip",
            sourceMap: true,
            preserveComments: false, //"some", "all"
        },
        application: {
            options: {
                // expand: true,
                banner: '<%= app.banner %>',
                preserveComments: "some"
            },
            src: 'dist/js/application.js',
            dest: ".tmp/js/application.min.js"
        },
        dependencies: {
            options: {
                sourceMap: false
            },
            src: ['dist/js/dependencies.js'],
            dest: ".tmp/js/dependencies.min.js"
        },

我知道 grunt-usemin从 gruntfile 选项中声明的 html 文件中的代码块生成srcdestuseminPrepare选项,例如:

    <!-- build:js js/app.js -->
    <script src="js/app.js"></script>
    <script src="js/controllers/thing-controller.js"></script>
    <script src="js/models/thing-model.js"></script>
    <script src="js/views/thing-view.js"></script>
    <!-- endbuild -->

那么如何配置grunt-usemin使用这些相同的选项,例如bannersourceMap: false使用生成的文件块,我已经阅读了通常在 github 或 NPM 注册表中给出的快速文档,但似乎没有找到一个可靠的答案。

4

1 回答 1

13

文档中的一句话非常重要:

此外,useminPrepare 动态生成 concat、uglify 和 cssmin 的配置。重要提示:您仍然需要手动管理这些依赖项并调用每个任务。

原则是只声明你想使用usemin(在grunt register任务中)你想要的所有主要任务:concat,uglify ... Usemin默认情况下会根据你的registertask选项创建所有这些任务而不再声明和 html 标记注释。

代码胜于文字:

  1. 表达你的块标记目标文件。在您的情况下,例如:
     <!-- build:js js/app.min.js -->
     <script src="js/app.js"></script>
     <script src="js/controllers/thing-controller.js"></script>
     <script src="js/models/thing-model.js"></script>
     <script src="js/views/thing-view.js"></script>
     <!-- endbuild -->

2 - 注册您希望 usemin 在运行时为您生成的任务(它不会在您的文件中生成任何内容 - 应该在文档中详细说明)。例如 :

grunt.registerTask('minify', ['useminPrepare','concat','cssmin','uglify','copy'
,'rev ,'usemin'])

3 - 默认情况下,除了 useminPrepare 和 usemin 之外,所有这些任务都会生成(查看这两个块grunt-usemin的文档)。

然后,如果您想添加特定选项,例如 sourcemap,只需重写配置代码而不重新定义所有内容:

丑化:{选项:{sourceMap:假}}

希望能帮助到你。

于 2014-05-23T15:17:10.477 回答