Question

当我使用grunt构建时，我有两个任务：

将preprocess:dist复制到app/scripts/config.js并将dist/scripts/config.js替换为// @echo FOO的第一项任务BAR。

然后，使用min，将所有app/scripts/**/*.js连接到dist/scripts/application.js。

在Gruntfile中构建任务：

grunt.registerTask('build', [
    'clean:dist',
    'preprocess:dist',
    'useminPrepare',
    ...
    'htmlmin'
    'concat',
    'usemin'
]

我在index.html中的包含脚本：

<!-- build:js({.tmp,dist,app}) scripts/application.js -->
<script src="/scripts/config.js"></script>
<script src="/scripts/other_file.js"></script>
<script src="/scripts/yet_another_file.js"></script>
<!-- endbuild -->

一切正常，但在连接文件dist / scripts / application.js中，我有来自config.js的{{1}}，而不是来自app/scripts的{。}}。

我认为dist/scripts之后的({.tmp,dist,app})用于指定连接时文件的位置，但仍然从错误的目录（app而不是dist）获取config.js。

所以我最终得到了// @echo VAR未被替换的config.js。

如何在连接时告诉concat / usemin从dist而不是应用程序中获取config.js？

注意：一种解决方案是让预处理将build:js放入config.processed.js，然后包含此文件而不是app/scripts，这样我就不必更改usemin运作方式。

但是我必须在.gitignore中输入config.processed.js，我的源文件中有一个生成的文件......

我希望在.tmp或dist。

中生成此文件

编辑：我的整个Gruntfile：

config.js

Answer 1

我遇到了同样的问题，我通过以下步骤解决了问题：

1）使用与您的脚本不同的构建类型“js”，因此usemin插件将在构建过程中忽略它。例如，“dev”。

<!-- build:dev({.tmp,dist,app}) --><script src="/scripts/config.js"></script><!-- endbuild -->

请注意，由于usemin（Issue 128）上的错误，没有空格。我正在运行usemin版本2.1.1

有了这个， grunt服务器将使用源代码中的config.js。

2）修改预处理任务，将预处理文件放在临时文件夹中，如.tmp。例如：

dist: {
        src: 'app/scripts/config.js', dest: '.tmp/scripts/config.processed.js'
      }

3）现在你需要使用usemin动态生成的dist文件夹中的scripts / application.js在.tmp文件夹中为 Concat 你的config.processed.js创建一个Grunt任务。

例如：

concat: {
          environment: {
              dest: 'dist/scripts/application.js',
              src: ['dist/scripts/application.js', '.tmp/scripts/config.processed.js']
          }
        },

如果您使用的是Windows，则需要使用\\而不是/

4）最后，你需要把所有这些放在一起。您的构建任务应如下所示：

 grunt.registerTask('build', [
    'clean:dist',
    'includeSource:dist',
    'preprocess:dist',
    'useminPrepare',
    'concurrent:dist',
    'autoprefixer',
    'concat',
    'copy:dist',
    'cdnify',
    'ngmin',
    'cssmin',
    'concat:environment',
    'uglify',
    'rev',
    'usemin'
  ]);

Answer 2

使用这个包：

https://www.npmjs.org/package/grunt-file-append

您可以将生成的文件附加到连接的临时文件中。

您应该完全从html中删除config js的引用，并在构建任务列表中的concat任务之后添加file-append任务，以将生成的配置文件附加到连接的js。

grunt usemin和concat：首先在dist中取一个文件而不是app

2 个答案: