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

sassify-pro

v1.0.6

Published

SassifyPro is a powerful Sass compiler designed to revolutionize your web development workflow.

Downloads

35

Readme

SassifyPro

SassifyPro is a powerful Sass compiler designed to revolutionize your web development workflow.

MIT License pages-build-deployment Build

SassifyPro

Installation

To install SassifyPro, follow these steps:

  1. Ensure that you have Node.js and npm (Node Package Manager) installed on your machine.
  2. Open your terminal or command prompt.
  3. Run the following command:
npm install -g sassify-pro

Getting Started

Once you have SassifyPro installed, you can start using it to compile your Sass/SCSS files. Follow these steps to get started:

  1. Open your terminal or command prompt.
  2. Navigate to the root directory of your project.
  3. Run the following command:
npx sassify-pro compile [input-file] [output-file]

Replace [input-file] with the path to your Sass/SCSS file and [output-file] with the desired path and name for the compiled CSS file.

For example:

npx sassify-pro compile src/main.scss dist/style.css

This will compile the main.scss file located in the src directory and save the compiled CSS file as style.css in the dist directory.

Features

Watch Mode

SassifyPro provides a convenient watch mode that automatically re-compiles your Sass/SCSS files whenever changes are detected. To use the watch mode, run the following command:

npx sassify-pro watch [input-directory] [output-directory]

Replace [input-directory] with the path to your Sass/SCSS source directory and [output-directory] with the path to your desired output directory for the compiled CSS files.

For example:

npx sassify-pro watch src/ dist/

This will watch the src directory for any changes to Sass/SCSS files and compile them into the dist directory.

Source Maps

SassifyPro supports generating source maps to facilitate easier debugging of your CSS in development. To enable source maps, use the --source-map flag when compiling your Sass/SCSS files:

npx sassify-pro compile --source-map [input-file] [output-file]

For example:

npx sassify-pro compile --source-map src/main.scss dist/style.css

This will generate a source map file alongside the compiled CSS file.

Import Paths

If you have Sass/SCSS files located in different directories and need to import them using relative paths, SassifyPro allows you to define import paths. You can specify the import paths using the --import-path flag:

 npx sassify-pro compile --import-path [path] [input-file] [output-file]

For example:

npx sassify-pro compile --import-path src/scss src/main.scss dist/style.css

This will add the src/scss directory as an import path, allowing you to import Sass/SCSS files from that directory using relative paths.

Configuration

SassifyPro supports configuration through a sassifypro.json file in JSON format. You can place this file in the root directory of your project to define default options for SassifyPro.

Here's an example sassifypro.json file:

{
  "sassFilePath": "src",
  "cssOutputPath": "public",
  "sourceMap": false,
  "importPaths": []
}

With this configuration file present, you can omit certain options when running SassifyPro commands.

Documentation

For detailed documentation on using SassifyPro, please refer to the official documentation.

Contributing

We welcome contributions to SassifyPro! If you find any issues or have suggestions for improvements, please submit them in the issue tracker.

To contribute code changes, please follow our contribution guidelines.

License

SassifyPro is licensed under the MIT License.

Acknowledgements

  • We would like to express our gratitude to the open source community for their invaluable contributions, which made the development of SassifyPro possible.

Support

If you need any assistance or have any questions, please contact our support team at [email protected].

Thank you for choosing SassifyPro! We hope it enhances your Sass/SCSS development workflow and helps you write cleaner and more maintainable CSS.