部署缩小的javascript文件并调试[关闭]答案

【问题标题】：Deploy minfied javascript files and debug [closed]部署缩小的javascript文件并调试[关闭]
【发布时间】：2015-04-11 02:01:08
【问题描述】：

所以我完成了一个新的角度应用程序的构建，我想将它部署到生产中......当然我已经准备好了我所有的角度代码，这样它就可以被缩小，所以我在那里被覆盖了！！但有些我不明白...我有很好的代码分离和我的应用程序的完整单元测试...结果，当然，我的主页上有很多脚本标签。

我当然需要在开发时在运行时调试我的 javascript，但是当我去部署时，我需要缩小。这里的最佳做法是什么？在我将代码移动到生产机器后，这实际上是用我的 all.min.js 文件替换脚本标签的手动过程吗？我是否也缩小了所有的 css 和 html？我正在使用 gulp 进行缩小...

感谢您的帮助....

【问题讨论】：

您可以使用在调试模式或发布模式下提供脚本的服务器端组件，具体取决于您的需要。
不应是手动过程。有太多的方法可以做到这一点，这使得这个问题对于 Stack Overflow 来说太宽泛了。如果您尝试某事并卡住了，那么您对这个论坛有一个很好的问题。
你不需要缩小 html。
juan 这个问题一点也不宽泛……得到了一些很好的答案。

标签： javascript angularjs gulp minify gulp-uglify

【解决方案1】：

如果没有服务器端模板（如 Razor 或 Thymeleaf），我建议使用 gulp-preprocess、gulp-processhtml 或 gulp-html-replace。

【讨论】：

【解决方案2】：

使用 gulp 在开发和生产中连接您的文件。您可能希望使用gulp-sourcemaps 来调试您的客户端javascript，就好像它们是单独的文件一样。

这是一个示例gulpfile.js

gulp.task('script', function(){
  gulp.src('./app/**/*.js')
  .pipe(sourcemaps.init())
  .pipe(concat('application.js'))
  .pipe(sourcemaps.write())
  .pipe(gulp.dest('./build'))
})

gulp.task('script:prod', function(){
  gulp.src('./app/**/*.js')
  .pipe(concat('application.js'))
  .pipe(ugilfy())
  .pipe(gulp.dest('./build'))
})

那么在您看来，只需将其指向构建文件即可。

<script src="/build/application.js"></script>

部署时，运行gulp script:prod。在开发中，运行gulp script。

【讨论】：