从我的 node_modules 文件夹转换 AngularJS 的正确方法答案

【问题标题】：Correct way to transform AngularJS from my node_modules folder从我的 node_modules 文件夹转换 AngularJS 的正确方法
【发布时间】：2016-02-18 09:38:42
【问题描述】：

我选择使用 npm 来包含我的 UI 依赖项，例如 AngularJS。

安装后依赖关系存在于node_modules文件夹中。

我可以通过<script src='/node_modules/angular/etc.'></script>直接使用AngularJS

实际上，我想做的是将其转换为我的 gulp 任务的一部分，然后移动（如果需要，缩小/丑化）到我的资产文件夹。

这样做的正确方法是什么？如何找到所有依赖库，这是手动包含还是有更好的方法？

我的 gulp 任务如下所示：

gulp.task("min:js", function () {
    gulp.src(["js/**/*.js", "!" + "js/**/*.min.js"], { base: "." })
        .pipe(concat("assets/js/site.min.js"))
        .pipe(uglify())
        .pipe(gulp.dest("."));
});

【问题讨论】：

这是一个好的开始blog.codecentric.de/en/2014/08/angularjs-browserify。另外我建议你探索 webpack 和 gulp-webpack

标签： angularjs node.js gulp

【解决方案1】：

您显然没有使用 yeoman 和 bower，并不是说不使用它有什么问题。

https://github.com/yeoman/generator-angular

http://yeoman.io/codelab/

看看 Yeoman 生成器，特别是“generator-angular”。这将根据一些（公认的）最佳实践为您设置（脚手架）您的角度项目。并利用 bower 来管理您的客户端依赖项。然后（自动配置）Gulp 用于构建/包含/捆绑依赖项。

我的建议是安装 yeoman，并检查“generator-angular”生成器，然后查看 gulp 如何管理来自 bower 组件的依赖项的构建。

即一旦您使用了类似 yeoman 生成器之类的东西，大部分工作都会为您完成，即 yeoman 生成器可以轻松解决您的这个特殊问题。

【讨论】：

【解决方案2】：

您似乎在使用 Gulp 方面走在了正确的轨道上，但是，您很快就会意识到，如果您是这种方法的新手，那么不使用捆绑器会比您希望的要困难一些。我相信你会从使用像 Browserify 或 Webpack 这样的加载器中受益。这两者都允许您将所有客户端依赖项组合成您认为合适的捆绑包。这些库将允许您使用 AMD 和/或 CommonJS 来“要求”您的依赖项。

【讨论】：