{"id":15041610,"url":"https://github.com/stevenschobert/metalsmith-sass","last_synced_at":"2025-04-13T10:57:10.186Z","repository":{"id":14915900,"uuid":"17640015","full_name":"stevenschobert/metalsmith-sass","owner":"stevenschobert","description":"Sass plugin for Metalsmith.","archived":false,"fork":false,"pushed_at":"2023-02-04T04:54:35.000Z","size":334,"stargazers_count":48,"open_issues_count":8,"forks_count":23,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-04-06T16:54:42.287Z","etag":null,"topics":["css","javascript","metalsmith","node","node-sass","sass","sass-plugin","static-site-generator"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/stevenschobert.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-03-11T17:44:29.000Z","updated_at":"2023-08-06T06:22:26.000Z","dependencies_parsed_at":"2023-02-18T14:00:26.635Z","dependency_job_id":null,"html_url":"https://github.com/stevenschobert/metalsmith-sass","commit_stats":null,"previous_names":[],"tags_count":22,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stevenschobert%2Fmetalsmith-sass","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stevenschobert%2Fmetalsmith-sass/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stevenschobert%2Fmetalsmith-sass/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stevenschobert%2Fmetalsmith-sass/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/stevenschobert","download_url":"https://codeload.github.com/stevenschobert/metalsmith-sass/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248703195,"owners_count":21148117,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["css","javascript","metalsmith","node","node-sass","sass","sass-plugin","static-site-generator"],"created_at":"2024-09-24T20:46:16.987Z","updated_at":"2025-04-13T10:57:10.159Z","avatar_url":"https://github.com/stevenschobert.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"metalsmith-sass\n===============\n\n[![Build Status](https://app.travis-ci.com/stevenschobert/metalsmith-sass.svg?branch=master)](https://app.travis-ci.com/stevenschobert/metalsmith-sass)\n\nA Sass plugin for Metalsmith.\n\n## Installation\n\n```sh\nnpm install --save metalsmith-sass node-sass\n```\n\n\u003e Note: As of [v2.0](https://github.com/stevenschobert/metalsmith-sass/releases/v2.0.0), `node-sass` is listed as a peer dependency, and will need to be installed alongside metalsmith-sass as shown above.\n\n## Getting Started\n\nIf you haven't checked out [Metalsmith](http://metalsmith.io/) before, head over to their website and check out the\ndocumentation.\n\n## CLI Usage\n\nIf you are using the command-line version of Metalsmith, you can install via npm, and then add the\n`metalsmith-sass` key to your `metalsmith.json` file:\n\n```json\n{\n  \"plugins\": {\n    \"metalsmith-sass\": {\n      \"outputStyle\": \"expanded\"\n    }\n  }\n}\n```\n\n## JavaScript API\n\nIf you are using the JS Api for Metalsmith, then you can require the module and add it to your\n`.use()` directives:\n\n```js\nvar sass = require(\"metalsmith-sass\");\n\nmetalsmith.use(sass({\n  outputStyle: \"expanded\"\n}));\n```\n\n## Options\n\nSee [node-sass](https://github.com/andrew/node-sass) for a complete list of supported options.\n\nIn addition to the options that node-sass provides, metalsmith-sass provides the following options:\n\n### outputDir\n\nChange the base folder path styles are output to. You can use this in combination with\nMetalsmith's `destination` option to control where styles end up after the build.\n\nThe final output directory is equal to `Metalsmith.destination() + outputDirOption`. For example,\nthe following setup output styles to `build/css/` even though the source files are in `src/scss/`:\n\n```js\nMetalsmith()\n  .source(\"src/\")\n  .destination(\"build/\")\n  .use(sass({\n    outputDir: \"css/\"   // This changes the output dir to \"build/css/\" instead of \"build/scss/\"\n  }))\n  .build(function () {\n    done();\n  });\n```\n\nAs of version [v1.1](https://github.com/stevenschobert/metalsmith-sass/releases/v1.1.0), you can also use a function to dynamically manipulate the output dir.\n\nThis is useful if you want to preserve your folder structure, but change just one folder name.\n\n```js\nMetalsmith(__dirname)\n  .source(\"src/\")\n  .destination(\"build/\")\n  .use(sass({\n    outputDir: function(originalPath) {\n      // this will change scss/some/path to css/some/path\n      return originalPath.replace(\"scss\", \"css\");\n    }\n  }))\n  .build(function () {\n    done();\n  });\n```\n\n## Source Maps\n\nThe easiest way to enable source maps in your metalsmith project is to add the following options:\n\n```js\nMetalsmith(__dirname)\n  .source(\"src/\")\n  .destination(\"build/\")\n  .use(sass({\n    sourceMap: true,\n    sourceMapContents: true   // This will embed all the Sass contents in your source maps.\n  }))\n  .build(function () {\n    done();\n  });\n```\n\nThough the `sourceMapContents` is not required, I recommend adding it, otherwise you'll need to\nmanually serve up your `.scss` files along with your compiled `.css` files when you publish your\nsite.\n\n## .sass files\n\nAs of version [v1.2](https://github.com/stevenschobert/metalsmith-sass/releases/v1.2.0),\nmetalsmith-sass automatically handles `.sass` files, so you don't need to specify the `indentedSyntax`\noption. Though you might still need set options for `indentType` and `indentWidth` if you are\nusing something other than 2 spaces for indentation.\n\n## Credits\n\nThanks to [Segment.io](http://github.com/segmentio) for creating and open-sourcing\n[Metalsmith](https://github.com/segmentio/metalsmith)! Also thanks to the whole community behind\nthe [node-sass](https://github.com/andrew/node-sass) project.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstevenschobert%2Fmetalsmith-sass","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fstevenschobert%2Fmetalsmith-sass","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstevenschobert%2Fmetalsmith-sass/lists"}