使用Grunt Uglify进行动态映射和Concat [英] Dynamic Mapping and Concat with Grunt Uglify

问题描述

我尝试使用动态映射并concat使用Grunt Uglify的Javascript文件。

我有以下的不能正常工作。

这是我的文件夹结构：

  javascript 
 |  - 账户
 |  -  custom.js 
 |  - 账单
 |  -  billing-one.js 
 |  -  billing-two.js 
 |  -  test（输出文件夹）
  

以下是我期待的内容：

  javascript 
 | - 账户
 |  -  custom.js 
 |  - 账单
 |  -  billing-one.js 
 |  -  billing-two.js 
 |  -  test 
 |  -  billing-one.min.js（该文件包含billing-one.js和custom.js）
 |  -  billing-two.min.js（该文件包含billing-two.js和custom.js ）
  

这就是我目前得到的结果：

  javascript 
 |  - 账户
 |  -  custom.js 
 |  - 账单
 |  -  billing-one。 js 
 |  -  billing-two.js 
 |  - 测试
 |  - 账单
 |  -  billing-one.min.js（此文件仅包含billing-one.js） 
 |  -  billing-two.min.js（该文件仅包含billing-two.js）
 |  - 账户
 |  -  custom.min.js（该文件仅包含custom.js ）
  

它不包含custom.js文件，而是创建一个2文件夹 test / account / custom.min.js
'test / bills / billing-one.js' - 见上文

 options：{
美化：true，
 mangle：false，
 compress：false，
 preserveComments：'all'
} ，
文件：[
 {
展开：true，//启用动态展开。 
 cwd：'javascript /'，// Src匹配相对于此路径。 
 src：[[bills / *。js']，'account / custom.js']，//实际匹配的模式。 
 dest：'test /'，//目标路径前缀。 
 ext：'.min.js'，// Dest文件路径将具有此扩展名。 
 extDot：'first'//文件名中的扩展名在第一个点后面开始
}，
]，
  

我希望 bills / 文件夹中的所有Javascript文件包含custom.js

$ b $因此，如果有2个文件：
账单/ billing-one.js
账单/账单 - 二.js

我希望测试/文件夹包含

test / billing-one.min.js （此文件包含billing-one + custom.js）
test / billing-two.min。 js （这个文件包含billing-two + custom.js）

我不想在文件名中拼写代码。if将更多文件添加到 bills / 文件夹中，并将其输出到 test / 文件夹中。

非常感谢任何帮助。

更新自答案被接受：

使用后续更新的代码确保它按预期工作 - 否则您会r在运行GRUNT时出现错误。

我曾尝试通过提交编辑进行审查来将其添加到答案中。但它被所有知道所有优秀mods的人拒绝了两次......当它实际上是一个有效的输入并改进了给出的答案时。请注意 [] ， cwd 和 src 更改。 / p>

 文件：[{
展开：true，
 cwd：'javascript / bills /'，
 src：['* .js']，
 dest：'test /'，
 ext：'.min.js'，
 extDot：'first'
} ]，
  

解决方案

您可以使用grunt- contrib-uglify添加内容。
https://github.com/gruntjs/grunt-contrib-uglify#banner

以下是grunt配置：

 grunt.initConfig {{uglify：{options：{banner：grunt.file.read（'./ javascript / account / custom.js'），美化：true，mangle：false， compress：false，preserveComments：'all'}，files：{expand：true，cwd：'javascript /'，src：['bills / *。js']，dest：'test /'，ext：'.min。 
 
 
 

>在上述配置中，bills文件夹中的每个文件都将获得banner属性中配置的custom.js的内容。

我希望它能帮助你。

I'm trying to use dynamic mapping AND concat Javascript files with Grunt Uglify.

I have the following which is not working correctly.

Here is my folder structure:

javascript
    |- account
        |- custom.js
    |- bills
        |- billing-one.js
        |- billing-two.js
    |- test (output folder)

Here is what I'm expecting:

javascript
    |- account
        |- custom.js
    |- bills
        |- billing-one.js
        |- billing-two.js
    |- test
        |- billing-one.min.js (this file includes billing-one.js AND custom.js)
        |- billing-two.min.js (this file includes billing-two.js AND custom.js)

This is what I'm currently getting:

javascript
    |- account
        |- custom.js
    |- bills
        |- billing-one.js
        |- billing-two.js
    |- test
        |- bills
            |- billing-one.min.js (this file includes just billing-one.js)
            |- billing-two.min.js (this file includes just billing-two.js)
        |- account 
            |- custom.min.js (this file includes just custom.js)

It is not including the custom.js file but instead creates a 2 folders test/account/custom.min.js 'test/bills/billing-one.js' - see above

options: {
    beautify: true,
    mangle: false,
    compress: false,
    preserveComments: 'all'
},
files: [
  {
    expand: true,     // Enable dynamic expansion.
    cwd: 'javascript/',      // Src matches are relative to this path.
    src: [[bills/*.js'], 'account/custom.js'], // Actual pattern(s) to match.
    dest: 'test/',   // Destination path prefix.
    ext: '.min.js',   // Dest filepaths will have this extension.
    extDot: 'first'   // Extensions in filenames begin after the first dot
  },
],

I want all the Javascript files within the bills/ folder to contain custom.js

So if there are 2 files: bills/billing-one.js bills/billing-two.js

I would expect test/ folder to include

test/billing-one.min.js (this file would contain billing-one + custom.js) test/billing-two.min.js (this file would contain billing-two + custom.js)

I don't want to hard code the file names in. If more files are added tobills/ folder the should be concat and output to the test/ folder.

Any help much appreciated.

UPDATE SINCE ANSWER ACCEPTED:

Use the follow updated code to make sure this works as intended - otherwise you'll run into errors when running GRUNT.

I did try adding this to the answer by submitting an edit for review. But it got rejected, twice, by the all knowing all superior mods... when in fact it's a valid input and improves on the answer given. Note the [], cwd and src changes.

files: [{
    expand: true,
    cwd: 'javascript/bills/',
    src: ['*.js'],
    dest: 'test/',
    ext: '.min.js',
    extDot: 'first'
}],

解决方案

You can use the banner property of grunt-contrib-uglify to append the content. https://github.com/gruntjs/grunt-contrib-uglify#banner

Here is the grunt configuration:

grunt.initConfig({
    uglify: {
      options: {
        banner: grunt.file.read('./javascript/account/custom.js'),
        beautify: true,
        mangle: false,
        compress: false,
        preserveComments: 'all'
      },
      files: {
        expand: true,
        cwd: 'javascript/',
        src: ['bills/*.js'],
        dest: 'test/',
        ext: '.min.js',
        extDot: 'first'
      },
    }
  });

In the above configuration every file in the bills folder will get the content of custom.js configured in the banner property.

I hope it helps you.

这篇关于使用Grunt Uglify进行动态映射和Concat的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！