grunt将文件树注入javascript对象

时间:2016-02-02 19:02:21

标签: file tree gruntjs inject

有没有办法使用Grunt将文件树的结构读入JSON对象,然后将其注入javascript文件。

例如,假设我的项目有一个带结构的文件......

Assets
  ├╴docs                             
  │ └╴doc1.txt  
  │ └╴doc2.txt                  
  │ 
  ├╴effects 
  │ └╴sound.mp3

我可以注入一些.js文件。

Assets = { 
  docs : ['doc1.txt', 'doc2.txt.'],
  effects: [sound.mp3]       
}

其中初始资产等于某些卡片,例如'@@ injectHere'。

1 个答案:

答案 0 :(得分:0)

行。我认为这是一个两步过程。

首先,我用grunt-tree模块构建文件系统的JSON表示。我将JSON文件保存到.tmp文件夹中的临时文件中。

tree: {
  options: {
  },
  soundFileTree: {
    files: [
        {
            src: ['<%= yeoman.client %>/assets/audio/'],
            dest: '.tmp/soundTree.json',
        }
    ],
  },
},

第二次,我将JSON文件注入我的最终目的地。

我使用grunt-injector模块。我只是在transform()函数选项中使用require()来从.tmp文件夹中读取JSON。如果您需要()一个JSON文件,它将返回一个JSON对象。所以我的grunt文件看起来像这样......

injector: {
      // Inject JSON file into client and server files
      soundFileTree: {
        options: {
          transform: function(filePath) {
            var soundTreeJSONString = require(filePath); //you might have to adjust the files path
            return JSON.stringify(soundTreeJSONString);
          },
          starttag: '/* injector:soundFileTree */',
          endtag: '/* endinjector */',
        },
        files: {
          '<%= yeoman.client %>/treeTarget.js': ['.tmp/soundTree.json'],
        },
      }, 
   ...
}

我的目标文件看起来像这样(不是实际的文件夹和文件与我的问题不同。

var myVar=
/* injector:soundFileTree */
{"boxing":{"bell":"boxing/bell.wav","warning":"boxing/warning.wav"}}
/* endinjector */
;