精通 MEAN 了解一个 MEAN 应用程序（2）理解 Node.js 和 Bower 配置文件

look_w

理解 Node.js 和 Bower 配置文件我们很快就会接触到源代码。首先，快速访问 package.json，这是您在   中看到的 Node.js 配置文件。我还将介绍它在客户端的对应文件。这些文件都位于项目的根目录中。
package.json 在所有 Node.js 应用程序中，可以将 package.json 看作是最重要的配置文件。在该文件中，您将会发现提供给 Yeoman                生成器的应用程序的元数据，比如名称、描述和作者，如清单 2 中的部分 package.json 文件所示。
清单 2. package.json，第 1                部分

1 2 3 4 5 6 7 8 9

{   "name": "test",   "description": "Full-Stack JavaScript with MongoDB, Express, AngularJS, and Node.js",   "version": "0.0.1",   "author": "Scott Davis",   "engines": {     "node": "0.10.x",     "npm": "1.4.x"   },

接下来，您会看到一系列可以输入到命令提示符中的命令，如清单 3 所示。
清单 3. package.json，第 2                部分

1 2 3 4 5

"scripts": {   "start": "grunt",   "test": "grunt test",   "postinstall": "bower install --config.interactive=false" },

您已经输入了 grunt 来启动应用程序。稍后，您将输入 grunt test                来运行单元测试。postinstall 钩（hook）是区分服务器端依赖关系和客户端依赖关系的第一个提示。
在这个最重要的文件中，最重要的部分列出了应用程序的依赖关系，如清单 4 所示。这些 CommonJS 模块全部运行在应用程序的服务器端。
清单 4. package.json，第 3                部分

1 2 3 4 5 6 7 8 9 10 11 12 13 14

"dependencies": {   "express": "~4.2.0",   "mongoose": "~3.8.8" }, "devDependencies": {   "grunt-mocha-test": "~0.10.0",   "grunt-karma": "~0.8.2",   "karma": "~0.12.0",   "karma-jasmine": "~0.2.1",   "karma-coverage": "~0.2.0",   "karma-chrome-launcher": "~0.1.2",   "karma-firefox-launcher": "~0.1.3",   "karma-phantomjs-launcher": "~0.1.2" }

dependencies 代码块中声明了运行时依赖关系（比如与路由有关的 Express，与 MongoDB 有关的                Mongoose）。devDependencies 代码块中声明了开发者和编译时依赖关系（包括测试框架，比如                Mocha、Jasmine 和 Karma）。
bower.json现在，让我们来关注一下客户端。浏览器中加载的 JavaScript 库在 bower.json 中定义，如清单 5 所示。
清单 5. bower.json

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

{   "name": "test",   "version": "0.0.1",   "description": "Full-Stack JavaScript with MongoDB, Express, AngularJS, and Node.js",   "dependencies": {     "bootstrap": "~3",     "angular": "~1.2",     "angular-resource": "~1.2",     "angular-mocks": "~1.2",     "angular-cookies": "~1.2",     "angular-animate": "~1.2",     "angular-touch": "~1.2",     "angular-sanitize": "~1.2",     "angular-bootstrap": "~0.11.0",     "angular-ui-utils": "~0.1.1",     "angular-ui-router": "~0.2.10"   } }

您可以看到，bower.json 与 package.json 类似。它包含一些相同的元数据字段，并使用了一个                dependencies 块来定义客户端依赖关系，比如 Bootstrap（用于感官以及响应式 Web 设计）和                AngularJS（用于客户端单页面应用程序）。
同样，应用程序的源代码也被分到两个目录：一个用于服务器端，一个用于客户端。