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

gulp-css-single

v1.0.1

Published

Transform your CSS code.Make it just one line where one rule written in.Especially helpful to the developer who work at NetEase.

Downloads

2

Readme

gulp-css-single

一个可以将你的任何风格的CSS代码转为符合NEJ代码规范的形式的Gulp插件

大致原理:

  1. 将CSS代码解析为AST(抽象语法树);
  2. 根据AST按NEJ风格生成新代码;
  3. 返回新代码的Stream给下一个pipe;

使用方法:

  1. 从npm上安装本插件:
npm install --save-dev gulp-css-single
  1. gulpfile.js
var gulp = require('gulp');
var single = require('gulp-css-single');
gulp.task('single', function() {
    gulp.src(['src.css'])
        .pipe(single({
            indent:1,
            hasSpace:true
        }))
        .pipe(gulp.dest('dist'));
});
  1. 命令行:
gulp single

经过以上两个步骤,你可以将当前目录下的src.css转换成NEJ风格代码,设置缩进为1且“:”后有空格,并输出到dist目录中。

其中,配置项可选。格式为:

{
    indent: {number}  //缩进空格数,默认为1
    hasSpace: {boolean}  //属性key-value对的冒号后是否加空格,默认为true 
}

本插件采用MIT协议开源, 可以再此处获取源码gulp-css-single。 欢迎fork,也欢迎contribute。

如果你觉得本插件不错,不妨来gulp-css-single给个star吧!