Question

我正在设置gulp，将我所有的html文件从不同的模块移到一个views文件夹中。在modules文件夹内，每个模块文件夹具有相同的结构

modulename / client / views / anyFile.html

我已经写了口吃的任务“ move-html”。

gulp.task('move-html', function(){
    return gulp.src('./modules/*/client/views/*.html')
    .pipe(htmlmin({ collapseWhitespace: true }))
    .pipe(gulp.dest('./public/views'));
});

我希望将所有模块中的所有html文件都复制到./public/views，但是，我发现整个模块结构都已复制。

预期： index.html

实际输出：应用程式 |-客户 |-意见 | -index.html

我想这与模块/之后的星号有关，但是找不到其他方法的答案。

当我在gulp.src中使用文件名时，它可以正常工作，例如./modules/app/client/views / *。html

Answer 1

您说对了，*之前的路径部分很重要。它将形成路径的base。但这不是您想要的。您要消除路径中包含*并遵循.pipe(flatten())的部分。最简单的方法是使用gulp-flatten，该软件包将删除指定的父目录。

对于您来说，您可以像这样将它们全部删除：

const flatten = require("gulp-flatten");

gulp.task('move-html', function(){
  return gulp.src('./modules/**/client/views/*.html')
    .pipe(htmlmin({ collapseWhitespace: true }))

    .pipe(flatten())

    .pipe(gulp.dest('./public/views'));
});

仅保留文件名本身，然后可以将其倒入所需的任何目录中。所以：

./public/views/*.html

现在，您将根据需要以class ReactClass extends Component { constructor() { this.state = { highlightRowIndex: null } } setHighlightedRow = (index) => { const highlightRowIndex = index === null ? null : index - 1; this.setState({highlightRowIndex}); } render() { return ( <Table> <Tbody> {arr.map((row, index) => { const isHighlighted = index === this.state.highlightRowIndex return { <Trow isHighlighted={isHighlighted} onMouseOver={() => this.setHighlightedRow(index)} onMouseOut={() => this.setHighlightedRow(null)} > ... </Trow> } })} </Tbody> </Table> ) } } const Trow = styled.tr` & td { background-color: ${p => p.isHighlighted ? 'red' : 'white'}; } &:hover { background-color: red; } `;结尾。

使用Gulp从多个目录移动文件也将复制目录

1 个答案: