https://github.com/343830384/eng-drive
Eng 服务端 组件化 预编译和预渲染 支持相关工具
https://github.com/343830384/eng-drive
eng-drive eng-js eng-nos engjs nodejs vuejs
Last synced: about 1 month ago
JSON representation
Eng 服务端 组件化 预编译和预渲染 支持相关工具
- Host: GitHub
- URL: https://github.com/343830384/eng-drive
- Owner: 343830384
- License: apache-2.0
- Created: 2018-02-19T12:18:16.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2018-04-13T19:53:18.000Z (about 8 years ago)
- Last Synced: 2025-06-02T15:43:46.096Z (about 1 year ago)
- Topics: eng-drive, eng-js, eng-nos, engjs, nodejs, vuejs
- Language: JavaScript
- Homepage: https://juejin.im/user/59afb109f265da246b3c5fcb/posts
- Size: 54.7 KB
- Stars: 2
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
## Eng-Drive
* Eng-Drive 寓意为 ([Eng](https://github.com/343830384/Eng)的驱动) , 为[Eng](https://github.com/343830384/Eng)的web端 提供协作支持, 当然其也可以做为独立部分运行, 仅用做服务端的(组件)预渲染服务
* Eng-Drive 通过对 [Eng](https://github.com/343830384/Eng)语法 的组件编译,eng-compile 结尾的文件, 在服务端数据预渲染时, 拥有同类工具中最领先的优异性能
* Eng-Drive 的预编译文件, 可以运行在web端, 完美兼容所有版本浏览器, 通过 [Eng-NOS](https://github.com/343830384/Eng-NOS) 渲染 , 拥有变态到近乎世界第一的性能, 是 [Eng](https://github.com/343830384/Eng) 和其同类工具中佼佼者的完整渲染性能耗时的1/3左右, 纯html文本用时占比 1/10左右
### bug
* 0.9.1x 修复读取未压缩html文件导致的输出乱码
* 0.9.2x 修复对e-html指令的编译不正确
### 版本说明
* 0.9.0 版本, 仅提供基本的组件 预编译和渲染 功能
* 0.9.23 修复输出编译文件乱码, 增加数据渲染列表新特性支持, 具体参看Eng-NOS的demo内容和更新说明....
* 0.9.31 修复 manual 方法读取非min的html文本 输出乱码
### 理念
* Eng 做 精、简、小而强大 的 js 组件化渲染 插件/库
### 注意事项
* 仅对 [Eng](https://github.com/343830384/Eng) 的 e-base、e-attr、e-html、e-for 四个组件指令做出预编译和渲染, 涉及 Dom 操作目前不支持 . 并且事实上绝大部分常规页面的编写也仅仅会用到这四个指令 ;
* [Eng](https://github.com/343830384/Eng) 的其它指令/方法更适合用来开发具有交互逻辑的组件
#### 安装 : npm install -g eng-drive
#### 命令 : eng -init
* 在当前工作目录生成配置文件 config.json 和 默认 widgets 和 widgets_eng_compile 两个文件夹 (当前版本仅有输出目录配置)
```
{
"widgets_output":{ //输出目录
"base":"./",
"path":"widgets_ENG"
}
}
// eng -init 命令 等价于 require('eng-drive').init();
```
#### 命令 : eng -auto
* 自动查找 ./widgets 目录下所有的 组件 html文件编译输出到 ./widgets_eng_compile 目录下
* 注意 ./widgets 下的每个组件因该是单独的文件夹 , 命名为组件的命名 , 并且只有一个.html结尾的组件 , 其它文件也会被拷贝输出到 ./widgets_eng_compile 生成相同的目录结构
* 等价于 require('eng-drive').auto();
#### 方法 : eng.manual( htmlText , callback )
* 手动编译 eng 组件
```
* htmlText : Eng的html 组件文本
* callback : function( compileText )
* compileText : 编译后的文本
----------------------------------------------------------------
var html='
{{v}}
';
var eng=require('eng-drive');
eng.manual(html ,function(compileText){
console.log(compileText);
});
```
#### 方法 : eng.dataGlue(data , compileData , callback)
* 生成完整的html文本
```
* data : 组件数据
* compileData : 编译数据
* callback : function( htmlText )
* htmlText : 生成的html文本
----------------------------------------------------------------
var data={
base:{
v:'这仅是个基本范例'
}
};
var compileData={"base":{"v":{"1":[1]},"$_a":["
","","
"]},"$_a":[""]};
eng.dataGlue(data,compileData,function( htmlText ){
console.log(htmlText);
//这仅是个基本范例
});
```
#### 方法 : eng.dataGlueTo(data , compileData, src , widgetName , callback)
* 生成完整的html文本到指定的文件夹
```
* data : 组件数据
* compileData : 编译数据
* src : 输出路径
* widgetName : 组件文件夹命名
* callback : function(){
* //do some thing
* }
```
## License
[](LICENSE.txt)