0

我正在尝试使用 npm 工具和包将 LESS 文件和 ES6 文件复制和编译/转换到另一个目录。
这是我的基本结构： 

-src  
  -components  
    -component1  
      component1.js // es6 code 
      styles.less  
    -component2  
      component2.js // es6 code 
      styles.less  
    -component3  
      component3.js  // es6 code
      styles.less

这是所需的新目录结构： 

-lib  
  -component1  
    component1.js // es5 code 
    styles.css  
  -component2  
    component2.js // es5 code 
    styles.css  
  -component3  
    component3.js  // es5 code
    styles.css

对于我正在使用的 es6 transpile babel，它工作得很好： 

"build:js": "cross-env NODE_ENV=production babel ./src/components --out-dir ./lib --ignore spec.js"

但我与LESS文件斗争。我知道我可以cpx用来复制文件并保持结构： 

"build:less": "cpx \"./src/components/**/*.less\" ./lib"

但我想在处理它们时复制它们并将其LESS从CSS.
通过管道传递的每个文件都有-t一个模块转换的参数，但我找不到合适的模块来传递它们。
我试过了lessc，lessify但似乎不太合适。

"build:less": "cpx \"./src/components/**/*.less\" ./lib -t [less_compiler_here?]"

我不介意使用webpack或任何其他模式来实现这一点。

4

1 回答 1

0

在这里回答我自己的问题，
我没有找到适合我情况的解决方案。在测试了很多 npm 包后，我发现每个包都为我的挑战提供了一小部分解决方案，我决定编写自己的解决方案。
lessc-glob
基本上它需要一个glob并将结构从源复制到目标（使用 cpx），但它通过less转换流传递每个文件。当然，它.css最终将文件扩展名更改为。这是针对我的确切挑战的非常量身定制的解决方案，但也许有人会发现它很有用。
如果你愿意，请随时让它变得更好。

于 2017-06-05T10:47:42.617 回答