咕噜动态DEST位置青菜

这也可能会被重复的问题，但我无法找出一个解决方案，我的要求咕噜动态DEST位置青菜

我想创建一个SASS咕噜的任务，可以在动态位置生成CSS文件。这里是我的结构

 
/components 
--> xyz 
    --> scss 
    --> xyz.a.scss 
    --> xyz.b.scss 
--> abc 
    --> scss 
    --> abc.a.scss 
    --> abc.b.scss

繁重的任务可以即

 
/components 
--> xyz 
    --> scss 
    --> xyz.a.scss 
    --> xyz.b.scss 
    --> css 
    --> xyz.a.css 
    --> xyz.b.css 
--> abc 
    --> scss 
    --> abc.a.scss 
    --> abc.b.scss 
    --> css 
    --> abc.a.css 
    --> abc.b.css

我现在SASS任务创建一个新的相对于它的组件文件夹，生成SCSS

sass: { 
    dist: { 
      files: [{ 
      expand: true, 
      cwd: '<%= yeoman.client %>/components/', 
      src: ['**/*.scss'], 
      dest: '<%= yeoman.client %>/components/', 
      extDot: 'last', 
      ext: '.css' 
      }] 
    } 
},

的同一文件夹中的CSS文件

我知道我们可以通过在dest中提供组件文件夹名称来实现此目的，例如对于xyz组件我可以使用dest作为<％= yeoman.client％>/components/xyz/CSS。但是我将不得不为每个组件编写单独的任务。有没有一种方法可以将dest保存在同一个父文件夹中，而无需真正指定文件夹的名称？即src：['**/scss/*.scss']和dest是：['**/css/']有没有办法做到这一点？

来源

2016-03-06 Srikanth Kondaparthy

只是为了澄清，[编辑]你有一个SASS文件，并且你希望每个项目都能被处理到不同的地方？你运行一次，它输出的CSS到哪里？所有项目一次？我不明白你想要完成的任务背后的原因。 – suzumakes

对不起，如果我的问题不够清楚。忽略项目的事情，我编辑了这个问题。希望它是有道理的。 –

我认为你的样式（组件>文件夹> css | scss>文件）有一个四级分层结构，就我所能说的最好。您想知道Grunt是否可以命名第二级容器文件夹并通过所有组件递归？似乎你有一个项目架构问题。如果每个组件只有一个scss文件，则根本不需要这个二级文件夹。只需将所有scss组件放在一个文件夹中，然后将它们输出到CSS文件夹。也许我失去了一些东西...... – staypuftman

您可以使用动态参数的任务传递：

例如：

grunt sass:xyz

比代码，你可以使用这样的事情：

sass: { 
dist: { 
     files: [{ 
     expand: true, 
     cwd: '<%= yeoman.client %>/components/', 
     src: ['**/<%= grunt.task.current.args[0] %>/sass/*.scss'], 
     dest: '<%= yeoman.client %>/components/<%= grunt.task.current.args[0] %>/css', 
     extDot: 'last', 
     ext: '.css' 
     }] 
} 
},

的唯一的东西您必须设置一个通用任务，例如对所有组件执行它：

grunt.registerTask('sassAll', [ 'sass:xyz', 'sass:abc' ]);

甚至可以产生一个阵列和循环它：

grunt.registerTask('sassAll', function() { 
    gruntUtils.sassTasks.forEach(function(param){ 
     grunt.task.run('sass:' + param); 
    }); 
}); 

var gruntUtils = { 
    sassTasks : [ 'xyz', 'abc' ] 
};

可以使用用于设定甚至更多参数DEST和来源：

grunt sass:xyz/sass:xyz/css

和参照第二参数：

<%= grunt.task.current.args[1] %>

我找到了一个方法以检索目录（未子目录）的基座一个内：

var templates = grunt.file.expand({ 
       filter: "isDirectory", 
       cwd: "(your base dir path in relation to the gruntfile.js)/components" 
       },["*"]); 

var dirs = templates.map(function (t) { 
    return t; 
});

比你有一个数组（dirs），而不是使用[ 'xyz', 'abc' ]

来源

2016-03-11 10:20:33

感谢您的支持。我想它是关闭的，但我们仍然需要提供组件文件夹名称。整个目的是为了避免使用组件文件夹名称 –

解释了一种以自治方式采用目录的方法，但我不知道是否有可能在不编辑插件代码的情况下做你想做的事情。无论如何，您不必自己写文件夹名称，只需要一项任务！ –

我想我得到了我需要的东西。 –

咕噜动态DEST位置青菜

回答

相关问题