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

pxtorem-css

v1.0.6

Published

A nodejs cli that convert css unit px to rem

Downloads

16

Readme

pxtorem-css

A nodejs cli that convert px to rem in any css file

Description

pxtorem-css is a command line interface tool that converts pixel values to rem values in any CSS file. This tool is built using pure Node.js and comes with several advanced features to help you save time when writing CSS code.

Features:

  • Converts px to rem in CSS files quickly and easily
  • Allows you to choose the CSS directory and output directory
  • Enables you to include and exclude specific CSS files for conversion
  • Allows you to ignore specific CSS attributes that you don't want to convert
  • You can customize the tool's options with a pxtorem.config.json file in your project
  • Can be installed both locally and globally using npm/

Installation

Locally:

npm i pxtorem-css

Globally:

npm i -g pxtorem-css

Usage

$ pxtorem [options]

Options:
  -init,--init [type]       Init pxtorem options json (preset: "pxtorem.config.json")
  -s, --size [type]         Select html size (default: "16", preset: "16")
  -d, --dir [type...]       Select css directory (default: ["/"], preset: "/")
  -t, --type [type]         Select css ext type example: .scss (default: ".css", preset: ".css")
  -i, --ignore [type...]    Ignore css attribute (default: [], preset: [])
  -r, --replace [type]      For replace file name (default: false, preset: false)
  -o, --output [type]       Output directory (default: "", preset: "")
  -in, --include [type...]  For include css file path (default: [], preset: [])
  -ex, --exclude [type...]  For exclue css file path (default: [], preset: [])
  -c, --config [type]       For json config file (default: "", preset: "")
  -h, --help                display help for command

Example

$ pxtorem : change all directories css file.

$ pxtorem -d public/css : change all css file inside public/css dir.

$ pxtorem -d public/css -t .scss : change all .scss extname file inside public/css dir.

$ pxtorem -d public/css -t .scss -o public/remcss : change all .scss extname file inside public/css dir and write file to public/remcss dir.

$ pxtorem -d public/css -i box-shadow margin-left padding-left : change all css file inside public/css dir except box-shadow margin-left padding-left attribute px.

$ pxtorem -d public/css -r my/name/rem/.ext : change all css filename example: style.css to mystylerem.css and you must follow this pattern {your custom text before name}/name/{your custom text after name}/.ext

$ pxtorem -c pxtorem.json : Customize your options with json file in your project folder

$ pxtorem -init : generate pxtorem.config.json (or you can give custom name by passing value after -init) into your project folder

pxtorem.json Example

{
    "size": "16",
    "dir": ["public/css"],
    "type": ".css",
    "ignore": ["margin", "padding", "box-shadow"],
    "replace": "{your custom word}/name/{your custom word}/.ext",
    "output": "",
    "include": [],
    "exclude": []
}

Contribution

If you want to contribute or report any bug, you welcome