npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

bone

v0.4.9

Published

web frontend develop toolkit

Downloads

139

Readme

Bone

web前端开发工具

NPM version NPM version travis Coverage Status Join the chat at https://gitter.im/wyicwx/bone

###核心概念

  这个模块是Bone的核心功能,为了让使用者更容易读懂Bone的配置文件,核心模块提供了一种类似操作系统里文件系统的概念,我称它为虚拟文件系统,即将一个虚拟的文件地址映射到一个真实存在的文件地址上,同时可以标注虚拟文件是由何种方式对源文件处理(注意这里不对真实文件做任何处理,源文件是指对真实文件的在内容上的拷贝),对源文件的处理模块我称它为处理器,通过下面的示例你可以对Bone的虚拟文件系统有一个初步的了解。

###示例

这是一个简单Bone配置例子的示范,你需要在项目文件夹下创建bonefile.js文件,并安装bone-cli

var bone = require('bone');
var connect = require('bone-cli-connect');
var less = bone.require('bone-act-less');
var concat = bone.require('bone-act-concat');

// 定义生成文件夹dist,用来存放最终的文件
var dist = bone.dest('dist');

// 在dist下定义文件夹css(通过dist变量的链式调用为指定定义再其下的文件)
dist.dest('css')
	// 指定映射来源src/less下所有.less后缀的文件
   .src('~/src/less/*.less')
   // 所有文件都经过less处理
   .act(less({
   		ieCompat: false
   }))
   // 并重命名为.css后缀
   .rename(function(filename) {
		return filename.replace(/\.less$/, '.css');
   });

// 在dist下定义文件夹html
dist.dest('html')
	// 映射src/下将所有.html文件
	.src('~/src/*.html');

// 在dist下定义文件夹js
dist.dest('js')
	// 指定映射来源文件为src/main.js
	.src('~/src/main.js')
	// 将源文件与src/lib下所有.js后缀的文件合并
	.act(concat({
		files: '~/src/lib/*.js'
	}));

// 加载支持connect的插件
bone.cli(connect({
	base: './dist',
	port: 8080
}));

ps:'~/'符号指bonefile.js文件所在的文件夹位置,Bone中的文件路径都使用fs.pathResolve解析,详情请参阅api

安装示例中的依赖

$ npm install bone bone-cli-connect bone-act-less bone-act-concat --save-dev

启用connect后通过浏览http://localhost:8080查看文件

$ bone connect

###Grunt && Glup共存

bone.task('grunt', {
	exec: 'grunt'
});
bone.task('gulp', {
	exec: 'gulp',
	params: 'default'
});

bone.task的exec通过开启子进程,调用系统内其他命令行工具

###性能

当启用bone-cli-connectbone-cli-proxy时开启内部缓存,通过bone的fs api接口读取的文件内容都将会以buffer的形式缓存到内存里,当文件内容发生变化时,bone根据文件的依赖清空相应文件的缓存,缓存的粒度控制到单个文件。

###文档

###常用服务器

###常用处理器