Brunch:快捷的HTML5构建工具

欢迎移步我的博客阅读:《Brunch:快捷的HTML5构建工具》

Brunch

了解Brunch(官方介绍)

  • 编译你的脚本,模板,样式,链接它们
  • 将脚本和模板封装进common.js/AMD模块里,链接脚本和样式
  • 为链接文件生成源地图,复制资源和静态文件
  • 通过缩减代码和优化图片来收缩输出,看管你的文件更改
  • 并且通过控制台和系统提示通知你错误

安装

当你已经拥有Nodejs时(若没有,请到nodejs官网下载),就可以直接使用npm运行:

$ npm install -g brunch

新建 new

  • 新建一个Brunch

$ brunch new <skeleton-URL> [optional-output-dir]

new可以简写为n
<skeleton-URL>指定一个架构,则项目会应用此架构进行初始化。
[optional-output-dir]指定输出目录,项目名称可以自定义。

例如:

$ brunch n https://github.com/scotch/angular-brunch-seed myProject
08 Sep 12:20:32 - log: Cloning git repo "https://github.com/scotch/angular-brunc h-seed" to "E:\myProject"...
08 Sep 12:20:49 - log: Created skeleton directory layout
08 Sep 12:20:49 - log: Installing packages...

当不指定输出文件夹时,必须保证放置新项目的文件夹为空,否则会clone失败。

构建 build

$ brunch build --production

也可以简写为:

$ brunch b -P

这样构建一个分布式项目,使得项目的体积变小。

使用 watch

$ brunch watch --server

也可以简写为:

$ brunch w -s

让Brunch看管你的项目,然后你就可以运行项目了。输出结果如:

08 Sep 12:32:58 - error: { [Error: Component must have "E:\w\bower_components\console-polyfill\bower.json"] code: 'NO_BOWER_JSON' }
08 Sep 12:32:59 - info: application started on http://localhost:3333/
08 Sep 12:33:00 - warn: 'test\karma-e2e.conf.js' compiled, but not written. Check your javascripts.joinTo config.

注意

  • 必要安装项
    Git安装:Git
    bower安装:

$ npm install -g bower

  • 运行项目前
    执行$ bower install对项目初始化。

参考

【官网】【README】【Command】

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • ¥开启¥ 【iAPP实现进入界面执行逐一显】 〖2017-08-25 15:22:14〗 《//首先开一个线程,因...
    小菜c阅读 6,571评论 0 17
  • 原文链接:http://www.jianshu.com/p/6b816c609669 前传 出于兴趣最近开始研究k...
    悬笔e绝阅读 7,248评论 1 11
  • Node.js是目前非常火热的技术,但是它的诞生经历却很奇特。 众所周知,在Netscape设计出JavaScri...
    w_zhuan阅读 3,642评论 2 41
  • 雨中登泰山阅读 204评论 0 0
  • 你好,30岁 我现在很幸福。 家庭里,从女儿到外孙女、外甥女、妹妹到姐姐到女朋友到妻子、儿媳到现如今的妈妈;社会上...
    眉头轻蹙皱了谁的心阅读 332评论 1 1