首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >grunt-browserify aliasMapping两级深度

grunt-browserify aliasMapping两级深度
EN

Stack Overflow用户
提问于 2013-11-22 07:27:33
回答 2查看 1.9K关注 0票数 4

因此,我有一个文件目录,其中两个文件直接位于该文件夹中:

代码语言:javascript
复制
views/view1.js
views/view2.js

但其中一个嵌套了更深一层

代码语言:javascript
复制
views/other/view3.js

我想用grunt-browserify使用别名映射来编译它们,这样我就可以像这样要求它们:

require('view1')

require('view2')

require('other/view3')

因此,我在grunt-browserify配置中设置了简单的映射:

代码语言:javascript
复制
{
  expand: true,
  cwd: 'views/',
  src: ['**/*.js'],
  dest: ''
}

前两个文件require()正常,但最后一个文件找不到。我使用的别名映射只有一个级别的深度。我怎么才能让它降到我给它的每一级呢?

EN

回答 2

Stack Overflow用户

发布于 2014-02-12 04:03:08

整个aliasMappings选项似乎失效了,因为我甚至不能让他们的映射示例正常工作。我找到了另一个使用aliasify的解决方案(从this codebyronwong到kudos)。这是我的工作Gruntfile的样子:

代码语言:javascript
复制
var util = require('util');
var aliasify = require('aliasify');

module.exports = function(grunt) {

  // takes grunt-browserify aliasMappings config and converts it into an aliasify config.
  function configureAliasify(aliasMappings) {
    var expandedAliases = {};
    aliases = util.isArray(aliasMappings) ? aliasMappings : [aliasMappings];
    aliases.forEach(function (alias) {
      grunt.file.expandMapping(alias.src, alias.dest, {cwd: alias.cwd}).forEach(function(file) {
        var expose = file.dest.substr(0, file.dest.lastIndexOf('.'));
        expandedAliases[expose] = './' + file.src[0];
      });
    });

    return require('aliasify').configure({
      aliases: expandedAliases
    });
  }

  // Create alias mappings with aliasify
  var aliasMappings = configureAliasify({
    cwd: 'views',
    src: ['**/*.js'],
    dest: ''
  });

  // Project configuration.
  grunt.initConfig({
    browserify: {
      dist: {
        files: {
          'build/app.js': ['client/entry.js']
        },
        options: {
          debug: true,
          transform: [aliasMappings]
        }
      }
    }
  });

  // Load the plugin that provides the "browserify" task.
  grunt.loadNpmTasks('grunt-browserify');

  // Default task(s).
  grunt.registerTask('default', ['browserify']);

};

现在,client/entry.js文件可以要求views目录中存在的所有文件都作为别名。

请注意,虽然上面的解决方案可以工作,但为了支持tagify,不再维护aliasify。但是,tagifyaliasify有根本不同,因此不太确定使用该库的解决方案会是什么样子。

更新:经过一番尝试之后,我意识到没有必要使用aliasifytagify。基本上需要的是一个映射函数,它接受aliasMapping并返回一个alias数组。这或多或少是grunt-browserify应该对aliasMapping做的事情,但由于某些原因,它无法工作。这就是我最终得到的结论:

代码语言:javascript
复制
var util = require('util');

module.exports = function(grunt) {

  // Takes grunt-browserify aliasMappings config and converts it into an alias array
  function aliasMappingsToAliasArray(aliasMappings) {
    var aliasArray = [];
    aliases = util.isArray(aliasMappings) ? aliasMappings : [aliasMappings];
    aliases.forEach(function (alias) {
      grunt.file.expandMapping(alias.src, alias.dest, {cwd: alias.cwd}).forEach(function(file) {
        var expose = file.dest.substr(0, file.dest.lastIndexOf('.'));
        aliasArray.push('./' + file.src[0] + ':' + expose);
      });
    });
    return aliasArray;
  }

  // Project configuration.
  grunt.initConfig({
    browserify: {
      dist: {
        files: {
            'build/app.js': ['client/entry.js']
        },
        options: {
          debug: true,
          alias: aliasMappingsToAliasArray({
            cwd: 'shared',
            src: ['**/*.js'],
            dest: ''
          })
        }
      }
    }
  });

  // Load the plugin that provides the "browserify" task.
  grunt.loadNpmTasks('grunt-browserify');

  // Default task(s).
  grunt.registerTask('default', ['browserify']);

};
票数 5
EN

Stack Overflow用户

发布于 2014-03-01 20:53:55

在v2测试版中,该aliasMapping配置现在可以正常工作。

您可以使用npm install grunt-browserify@2安装它

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/20134063

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档