OpenComponents開發(fā)和分布html組件框架

OpenComponents是一款用于開發(fā)和部署強大，分布式html組件的框架。

它的目標是擁有一個系統(tǒng)，這個系統(tǒng)允許大量合作（可能涉及在多個項目數(shù)百名工程師），并且擁有一個促進代碼共享，減少依賴性，而且容易接近新特性和實驗的工具。

介紹

OpenComponents包含兩個方面：

• The components are small units of isomorphic code mainly consisting of html, javascript, css. They can optionally contain some logic, allowing a server-side node.js application to compose a model that is used to render the view. After rendering they are pieces of pure html to be injected in any html page.

• The consumers are websites or microsites (small independently deployable web sites all connected by a front-door service or any routing mechanism) that need components for rendering partial contents in their web pages.

該框架包含三個部分：

• The cli allows developers to create, develop, test, and publish components.

• The library is where the components are stored after the publishing. When components depend on static resources (such as images, css files, etc.) these are stored, during packaging and publishing, in a publicly-exposed part of the library that serves as cdn.

• The registry is a rest api that is used to consume, retrieve, and publish components. Since they are immutable, the registry is the entity that handles the traffic between the library and the consumers.

組件

該組件由以下目錄組成

創(chuàng)建

創(chuàng)建一個包含組件的文件夾

npm install oc -g
oc init hello-world

編輯，調(diào)試，測試

使用組件文件夾作為庫和觀察文件開始本地測試注冊表：

oc dev . 3030

觀察組件消耗時的狀態(tài)

oc preview http://localhost:3030/hello-world

一旦組件發(fā)生變化，你將能夠刷新這個頁面，看看它的外觀。

發(fā)布到注冊表

您需要一個連接到庫的在線注冊表。具有相同名稱和版本的組件將無法在注冊表共存。

# you have to do the registry config first, just onc
eoc registry add http://my-components-registry.mydomain.com
# then, ship it
oc publish hello-world/

現(xiàn)在應該可以登錄 http://my-components-registry.mydomain.com/hello-world.