sass-graph

Sass Graph

Parses Sass files in a directory and exposes a graph of dependencies

Install

Install with npm

npm install --save-dev sass-graph

Usage

Usage as a Node library:

var sassGraph = require('./sass-graph');

Usage as a command line tool:

The command line tool will parse a graph and then either display ancestors, descendents or both.

$ ./bin/sassgraph --help
Usage: bin/sassgraph <command> [options] <dir> [file]

Commands:
  ancestors    Output the ancestors
  descendents  Output the descendents

Options:
  -I, --load-path   Add directories to the sass load path
  -e, --extensions  File extensions to include in the graph
  -j, --json        Output the index in json
  -h, --help        Show help
  -v, --version     Show version number

Examples:
  ./bin/sassgraph descendents test/fixtures test/fixtures/a.scss
  /path/to/test/fixtures/b.scss
  /path/to/test/fixtures/_c.scss

API

parseDir

Parses a directory and builds a dependency graph of all requested file extensions.

parseFile

Parses a file and builds its dependency graph.

Options

loadPaths

Type: Array Default: [process.cwd]

Directories to use when resolved @import directives.

extensions

Type: Array Default: ['scss', 'sass']

File types to be parsed.

follow

Type: Boolean Default: false

Follow symbolic links.

exclude

Type: RegExp Default: undefined

Exclude files matching regular expression.

Example

var sassGraph = require('./sass-graph');
console.log(sassGraph.parseDir('test/fixtures'));

//{ index: {,
//    '/path/to/test/fixtures/a.scss': {
//        imports: ['b.scss'],
//        importedBy: [],
//    },
//    '/path/to/test/fixtures/b.scss': {
//        imports: ['_c.scss'],
//        importedBy: ['a.scss'],
//    },
//    '/path/to/test/fixtures/_c.scss': {
//        imports: [],
//        importedBy: ['b/scss'],
//    },
//}}

Running Mocha tests

You can run the tests by executing the following commands:

npm install
npm test

Authors

Sass graph was originally written by Lachlan Donald. It is now maintained by Michael Mifsud.

License

MIT

Similar packages

Other packages similar to sass-graph

postcss

PostCSS is a tool for transforming CSS with JavaScript plugins. While it is not limited to Sass, it can be used to analyze and manipulate CSS dependencies, similar to how sass-graph analyzes Sass dependencies.

node-sass-magic-importer

node-sass-magic-importer is a custom importer for node-sass that adds additional features to the standard Sass `@import` rule. It provides functionalities that can help manage dependencies, but it is more focused on extending the import capabilities rather than analyzing the dependency graph.

stylelint

Stylelint is a linter for stylesheets that can be used to enforce consistent conventions and avoid errors in stylesheets. It does not construct a dependency graph like sass-graph, but it can be used to analyze and lint the structure of Sass files.