构建Node.js和AngularJS应用程序
我即将尝试我的第一个AngularJS项目，使用Node.js作为后端是有意义的，尽管这意味着同时从头开始学习AngularJS和Node.js。
我要做的第一件事就是弄清楚一个好的文件结构。到目前为止，我的纯HTML/CSS模板具有以下目录结构...
_site/
Fonts/
Javascript/
SASS/
Stylesheets/
Index.html( _site是PSD等的工作目录。)
我找到了一个Node.js/AngularJS应用程序here的目录结构示例。
..。其建议如下目录结构。
app.js --> Application configuration
package.json --> For npm
public/ --> All of the files to be used in on the client side
css/ --> CSS files
app.css --> Default stylesheet
img/ --> Image files
js/ --> JavaScript files
app.js --> Declare top-level application module
controllers.js --> Application controllers
directives.js --> Custom AngularJS directives
filters.js --> Custom AngularJS filters
services.js --> Custom AngularJS services
lib/ --> AngularJS and third-party JavaScript libraries
angular/
angular.js --> The latest AngularJS
angular.min.js --> The latest minified AngularJS
angular-*.js --> AngularJS add-on modules
version.txt --> Version number
routes/
api.js --> Route for serving JSON
index.js --> Route for serving HTML pages and partials
views/
index.jade --> Main page for the application
layout.jade --> Doctype, title, head boilerplate
partials/ --> AngularJS view partials (partial jade templates)
partial1.jade
partial2.jade所以，这对我来说看起来相当不错(除了我不会使用Jade的事实)。
我还有以下问题……
- 我希望将所有前端文件和后端文件分开。此解决方案将所有前端文件放在公共/目录中，这在某种程度上是有意义的，因为大多数文件都需要是公共的，但是将SASS和_site文件夹放在这里有意义吗？我可以只保留它们，但不能在我将它们投入生产时上载它们，但这似乎是错误的，因为它们不应该公开。它们也不属于所有后端stuff.
- Wouldn't的根级别。从一个CDN
- Given加载AngularJS会更好，因为服务器只需要提供一个模板(主应用程序模板)，所有其他的超文本标记语言都将在前端构建。保持index.html文件静态，删除视图文件夹，并像原始的AngularJS种子应用程序那样，在AngularJS/下创建一个部分/文件夹，不是更有意义吗？
我意识到这完全是一个意见问题，从技术上讲，我可以把它们放在我想放的任何地方，但我希望比我更有经验的人能告诉我各种目录结构的陷阱。
回答 6
Stack Overflow用户
发布于 2012-12-22 14:50:04
1)公开saas/less文件通常是有意义的，因为您可能希望在调试时使用客户端less->css转换(less.js可以做到这一点)。但是不确定你的_site包含什么(顺便说一句，你应该在你的项目中使用小写的文件夹，特别是对于公共的东西)。
2)在生产中从Google CDN加载AngularJS通常是一个很好的做法，只使用本地版本进行开发，您可以有两个独立的布局，具体取决于您的环境。
3)即使客户端渲染是可行的，你也可以保持服务器端布局/视图渲染，你可能会在某些时候需要它(管理员访问，电子邮件渲染等)。但是，在公用文件夹中使用来自AngularJS的partials名称有助于避免混淆服务器端views和客户端partials。
你应该清楚地去做目前看起来最合乎逻辑的事情，当你熟悉express时，你可能会移动东西。
你应该检查一下现有的express框架，看看他们是如何构建他们的应用程序的。例如，TowerJS有一个非常干净的config文件夹，但是它们混淆了服务器端和客户端的代码，这是我个人不喜欢的。
查看NodeJS MVC frameworks的比较，看看其他人是如何做事情的。然而，我显然会从普通的express代码开始，以便完全控制&在过度使用这些框架之前理解事情是如何工作的。
Stack Overflow用户
发布于 2013-06-09 10:43:59
随着时间的推移，事情变得越来越容易。我把Yeoman用在了AngularJS的前端，它让我的工作变得更容易：http://yeoman.io/
选项1，MEAN.io
MEAN是一个很棒的缩写！我更喜欢平均堆栈目录结构。让我们使用传统的人！只要使用mean.io中的目录结构即可。MEAN也很方便，因为它包含了所有好东西，比如Grunt、Bower等。
选项2，Angular-seed + Express.js
我在GitHub上搜索过Node.js/AngularJS项目(可能还不够难)，没有看到任何真正适合起始目录结构的东西。因此，我将Node.js Express.js (既不使用EJS也不使用Jade/Pug运行Express.js from the command line )框架与angular-seed项目(clone it from GitHub)合并。然后我搬了一大堆东西。这是我想出来的：
developer-只有开发人员才会使用的东西。不需要部署。config- karma配置文件和others.scripts- developer脚本(构建、测试和deploy)test- tests.
和e2e
logsnode_modules- this Stack Overflow answer推荐将其放入Git中。然而，现在这可能是obsolete.public了--这几乎直接来自angular-seed 文件夹。css，img，js，lib，partials-非常明显，很好，而且很好用
routes- cron routes.server-服务器端"shebang“cron程序，守护进程，cron程序，whatever.server.js-从app.js重命名，只是为了更明显，这是服务器端。
Stack Overflow用户
发布于 2012-12-27 04:59:42
正如所建议的，这主要取决于个人喜好以及什么对你当时正在工作的项目有效。与你交谈的每个人都会有不同的想法，每个项目都有自己的设计--对一个有效的可能不适用于另一个。我希望你会尝试相当多不同的结构，很快就会找到最舒适的--但这仍然会随着时间的推移而发展。
我发现Angular的种子结构是最干净的，但这也是我个人的偏好(不过，它是由Angular团队设计的，这对我很有帮助)。
您还可以考虑使用Yeoman来生成项目框架。
Yeoman是一套健壮和自以为是的工具、库和工作流程，可以帮助开发人员快速构建漂亮的、引人注目的web应用程序。
它是一个很好的引导和管理项目的工具(类似于Rails的方式)，并将创建一个目录结构和框架文件供您构建。布赖恩·福特写了一篇关于在Angular中使用约曼的excellent post。
我还建议在他们的YouTube频道上观看Angular meetup的录音。我最近在山景城参加了一个聚会，会上提出了这些问题。Miško推荐了Angular Seed和Yeoman (至少是一个很好的起点)。
要回答您的个人问题，请执行以下操作：
- 任何在服务器端编译的文件都应该保存在公用文件夹之外。我建议不要将主PSD、模型或任何其他不打算公开使用(无论是浏览器还是用户)的文件放在公共文件夹中。
- 如果您期望高流量，从CDN提供静态资产(JS、图像、CSS)总是很好的。这对于访问量较少的网站并不那么重要，但仍然是一个好主意。我会从为初始开发提供本地文件开始。将资产优化留待您临近使用日期时再进行。当这个时刻到来的时候，你也会想要正确设置你的缓存。例如，Yeoman提供了一种对资产进行版本控制的好方法。
- 如果你的索引文件不需要任何服务器端渲染，就静态地为它提供服务。我喜欢让我的后端尽可能多地与Angular应用程序解耦。它有助于保持关注点的分离；在开发客户端文件时，您根本不需要考虑后端(Angular非常适合这一点。)
真的，你只需要玩玩；尝试不同的东西，阅读博客文章，从别人那里获得想法，提出问题(就像你在这里和Angular Google+社区页面上所做的那样)，观看视频，如果可以的话，参加聚会-聚会真的很棒。
https://stackoverflow.com/questions/13998793
复制相似问题