Powered by GitBook

学好node开发

认识Meteor文件结构

上一节中，搭建好了Meteor的开发环境，就可以新建一个项目跑起来。但是新建的项目，没有文件结构层次，显得比较杂乱。

由于Meteor比较灵活，它实际上是自动的帮我们加载了script和link标签。

规范的组织方式

  • .meteor Meteor 存储它内部代码的地方，尝试更改里面的内容并不是什么好主意。但是其中的packages文件和release文件是你安装的所有智能代码包和你使用的Meteor版本信息，值得关注。
  • /client 此目录下所有的文件都是在客户端使用，一般用于存放HTML, CSS, UI相关的JavaScript代码。
  • /server 此目录下所有文件都用于服务器端，永远不会用于客户端。一般用来存放敏感的逻辑和数据文件。
  • /lib 此目录存放的是公共模块，供客户端和服务器端使用。
  • /public 此目录下文件也是为客户端服务，此目录用于存放比如图片素材，在HTML中直接相对于根目录就能获取到文件。
  • /private 此目录下文件只为服务器端服务，并且通过Assets API获取。
  • /client/compatibility 此目录存放的是兼容性的JavaScript库文件, 这些文件依赖那些全局的变量，在这个目录下的文件会优先于其他客户端脚本文件执行。
  • /packages 保存自己开发的代码包
  • /test 此目录下文件永远不会执行，只是为了本地测试

没有按照规范组织的情况

如果JavaScript文件没有放到规范的目录下，都会被加载到客户端和服务器端。Meteor提供了两个方法区分客户端和服务器端:

Meteor.isClient() // 在客户端执行
Meteor.isServer() // 在服务器端执行

CSS和HTML的文件如果没有按照规范放置的话，只会被加载到客户端，不会加载到服务器端。下面看一个官方的例子：

lib/                      # common code like collections and utilities
lib/methods.js            # Meteor.methods definitions
lib/constants.js          # constants used in the rest of the code

client/compatibility      # legacy libraries that expect to be global
client/lib/               # code for the client to be loaded first
client/lib/helpers.js     # useful helpers for your client code
client/body.html          # content that goes in the <body> of your HTML
client/head.html          # content for <head> of your HTML: <meta> tags, etc
client/style.css          # some CSS code
client/<feature>.html     # HTML templates related to a certain feature
client/<feature>.js       # JavaScript code related to a certain feature

server/lib/permissions.js # sensitive permissions code used by your server
server/publications.js    # Meteor.publish definitions

public/favicon.ico        # app icon

settings.json             # configuration data to be passed to meteor --settings
mobile-config.js          # define icons and metadata for Android/iOS

文件加载顺序

对文件加载顺序最好的执行方法就是尽量避免明确的加载顺序。使用Meteor.startup或者在Packages中明确加载顺序。

下面是一些关于文件加载顺序的规则：

  • HTML模板文件始终第一个加载，在所有文件,即使以main.开头的文件
  • 以main.开头的文件其次加载
  • lib目录中的文件接着被加载
  • 深层次的目录下文件被加载
  • 其余文件按照字母顺序依次加载

官方也有一个例子:

nav.html
main.html
client/lib/methods.js
client/lib/styles.js
lib/feature/styles.js
lib/collections.js
client/feature-y.js
feature-x.js
client/main.js

组织你的项目

比如我们的项目又两个类型的对象apples和oranges.组织方式通常可以这样：

Root-Level Folders

可以将模块或者对象以顶级目录的形式进行管理:

apples/lib/               # code for apple-related features
apples/client/
apples/server/

oranges/lib/              # code for orange-related features
oranges/client/
oranges/server/

Folders inside client/ and server/

也可以分别在不同目录下进行管理:

lib/apples/               # common code for apples
lib/oranges/              # and oranges

client/apples/            # client code for apples
client/oranges/           # and oranges

server/apples/            # server code for apples
server/oranges/           # and oranges

Packages

最好的管理方式还是形成packages，方便独立，模块和重用。

packages/apples/package.js     # files, dependencies, exports for apple feature
packages/apples/<anything>.js  # file loading is controlled by package.js

packages/oranges/package.js    # files, dependencies, exports for orange feature
packages/oranges/<anything>.js # file loading is controlled by package.js

然后使用publish上传，通过meteor add <packages>安装。

参考资料