Gulp：如何将生成的文件输出到与源相同的文件夹？答案

【问题标题】：Gulp: how to make generated file output to the same folder as source?Gulp：如何将生成的文件输出到与源相同的文件夹？
【发布时间】：2014-10-06 05:46:54
【问题描述】：

1) 我有一个带有“best practices for angular app structure”的 Angular 应用程序设置。所以每个部分的文件夹可能有它自己的 *.scss 文件。需要将*.scss转换为*.css，并在同一个文件夹中输出*.css文件。

在 Gulp 中搞砸了几个小时，但语法不正确。它给了我很多不同的行为，但没有一个是我们想要的。

有人更了解 Gulp 吗？

2) 单独的 Gulp 问题，uglify 可以同时缩小 CSS 和 JS 文件吗？或者是否有单独的插件用于缩小 CSS？

3) 是否也有缩小 HTML 文件的插件？对可用的东西不太熟悉。仍在尝试从示例中学习，但他们将所有不同的插件组合在一起，我不需要全部使用它们。但是当我把它们分开时，我破坏了很多东西，所以让它们工作起来真的很耗时。我可以花几天时间来尝试让它正常工作。

【问题讨论】：

标签： angularjs minify gulp gulp-sass gulp-uglify

【解决方案1】：

是的，比起 grunt，我更喜欢 Gulp，而且我在 github 上有一个示例要点。你可以在这里查看：https://gist.github.com/manar007/7ce4dd0bdd9b76edb2ea。这是一个大型项目，我认为它会对您有所帮助
使用gulp-minify-css，它主要是为 CSS 东西配置的
如果您正在构建基于 Angular 的应用程序，那么更好的方法是配置 templateCache 并将所有 HTML 放入其中，然后将其与您的 js 文件连接起来，或者像其他文件一样嵌入 gulp-angular-templatecache

gulp.task('build-template-cache', function () {
  var stream = gulp.src('/app/**/*.html')
    .pipe(templateCache({
      module:'yourAngularModuleName'
    }))
    .pipe(gulp.dest(config.distDir + '/js'));
  return stream;
});

您可以在上面的 gist 链接中找到其他示例。

【讨论】：