AngularJS + Gulp - 我应该将所有文件连接在一起吗？

Question

我正在为我的第一个 AngularJS 应用程序提供最后的细节，我正在创建一个 Gulp 配置来丑化我的代码并设置一些常量以获得一种更简洁的方式来定义不同的环境。

现在，这是我的项目文件夹结构，我的组件按文件夹顺序排列，所以每个组件都有一个文件夹，所以开发起来更干净，因为我有很多组件：

src                                     
├── app                                 
│   ├── app.js                          
│   ├── config.js                       
│   └── index.html                      
└── resources                           
│    └── [...3rd party libraries...].min.js
└── components
    ├── admin
    |     ├── users
    |     |     ├── users.list.controller.js
    |     |     └── users.list.view.html 
    |     └── areas
    |           ├── areas.list.controller.js
    |           └── areas.list.view.html
    ├── [...etc...]
    └── [...etc...]

现在，从我的 index.html 中的配置开始，我已经导入了所有这些 .js，例如：

<script src="components/admin/users/users.list.controller.js"></script>
<script src="components/admin/areas/areas.list.controller.js"></script>

问题是，我应该将所有组件代码连接到一个文件中吗？如果是这样，我怎样才能将我所有的 html js 导入只变成一个（我要求一种自动化的方式，当然:)）

如果有人对我的应用结构或标准有任何想法，欢迎提出

谢谢！

Answer 1

我们通常会根据大小决定对我们的捆绑/缩小文件进行喙状处理。我们在开发和生产环境中使用不同的方法。

开发环境：

• 我们使用wiredep/gulp-inject 将js 文件传递​​到索引页面。
• 我们将观察程序置于wiredep/gulp-inject 任务上，以查看代码中的任何更改。以便新代码可以自动传递到索引页中
• 我们将 bower 用于客户端依赖项并自动执行该过程，以便在安装依赖项后参考将进入索引页面。

生产环境

• 将所有第 3 方库捆绑/缩小为单独的捆绑包。
• 在单独的包中捆绑/缩小所有项目文件。
• 经常观察这些包的大小，因为随着代码的增长，您可能需要将缩小的文件分成更多的文件。
• 我们使用 grunt-usemin 来提供压缩文件

参考文献

Wiredep/gulp-inject

usemin