Fork me on GitHub

关于Silky

Silky是什么

Silky是一个协同开发环境与构建工具,允许前端工程师完全脱离后端进行开发,使用简单,支持团队协作,支持自动化构建,支持多种工作环境。Silky从alpha版到现在,已经经过了70多个版本的迭代开发,Silky也是芒果TV前端部门目前日常必用的开发环境。

使用简单一直是Silky秉承的原则,安装完成后,一线的前端工程师只需要知道silky start命令和{{import "moduleName"}}的模板指令就可以使用Silky的大部分功能。而对于进阶用户,Silky提供更多的配置选项,甚至你可以自己动手开发Silky的插件,别担心,这一切都非常简单。

Silky的特点

模块化开发

传统的前端开发,代码重用必需依赖于后端,用户协同工作非常困难。但是大型网站的前后端开发通常是分离的,并且需要团队来共同完成一个前端项目。Silky最初就是为了解决代码重用的问题,我们可以将header部分独立出来,然后用{{import "header"}}导入,也可以通过{{loop "cell" 5}}来实现多次循环某个模块。

Silky使用Handlebars作为默认的模板引擎,并增加很多指令的扩展,使用起来非常简单,详细模板指令介绍请参考:Silky的模板介绍

支持多种工作环境

前端开发遇到的大麻烦之一就是线上与线下的环境不一样,比如说我们在开发环境可能需要加上debug的配置,比如说我们在本地开发与产品环境所引用的资源路径可能不一样等等问题。Silky的多环境就很好的解决了这个问题,更多请参考:如何使用Silky的多环境功能?

支持代理

前后端协同开发的时候,后端经常会在不同的服务器,通过代理功能,我们就可以解决AJAX跨域的问题。

自带http服务器

只需要一个简单的silky start的命令就可以启动一个http服务器,在非Silky项目中,也可以通过这种方式在本地搭建一个http服务器。

支持路由转发功能

在正式的产品环境中,url并不一定会对应到具体的文件,比如说http://localhost/实际上访问的文件可能是http://localhost/index.html。在angular项目中,我们可能会用到pushState来管理路由,但当你一刷新,就会出现404,因为实际文件是不存在的。

在Silky中,我们只需要配置一些路由规则,就可以轻松的解决这些问题,

实时编译Coffee/less/handlebars

CoffeeScript和less、scss这些"另类"的语言现在已经在前端界大行其道了,但如果我们在预览的时候还需要编译的话,那是一个很麻烦的事情。虽然有一些工具能监控文件改动并自动编译,但使用起来并不是那么的顺手。Silky提供一种透明的工作方式,对开发者来说,预览访问的还是css/js文件,由Silky自动处理这些文件。

默认情况下,Silky支持CoffeeScript,less和handlebars。例如当你访问一个main.js,如果你的项目中并不真实存在main.js,那么Silky会尝试查找main.coffee并编译。

你也可通过插件来支持其它类型的文件,例如jadetypescript或者scss,未来Silky也可能会原生支持这些文件类型的编译。

一键编译

通过简单的命令silky build就可以完成项目编译,自动编译handlebarscoffeescriptless,自动压缩代码,并且支持压缩HTML中的Javascript代码。支持忽略某些文件,支持文件改名。

通过第三方插件,你甚至可以编译后自动上传到服务器,实现一键部署的功能。

支持多语言

很多网站都有多语言,对于动态网站我们可以将多语言交给后端去做,但有些时候,我们可能是一个静态网页,Silky支持多国语言功能,并且能支持根据语言编译为多个网站。

支持插件扩展

插件功能是Silky的一个很重要的功能,通过插件可以让Silky满足不同项目的个性化需求,甚至可以用Silky来写静态博客。你也可以参与进来,为Silky编写不同功能的插件,比如说支持TypeScript或者jade等文件格式,更多请访问:如何开发Silky的插件