{"id":15013328,"url":"https://github.com/meteor-community-packages/meteor-scss","last_synced_at":"2025-05-15T23:06:57.126Z","repository":{"id":8118371,"uuid":"9534760","full_name":"Meteor-Community-Packages/meteor-scss","owner":"Meteor-Community-Packages","description":"Node-sass wrapped to work with meteor.","archived":false,"fork":false,"pushed_at":"2025-03-21T08:44:16.000Z","size":225,"stargazers_count":310,"open_issues_count":25,"forks_count":76,"subscribers_count":16,"default_branch":"master","last_synced_at":"2025-05-15T23:06:41.929Z","etag":null,"topics":["css","hacktoberfest","meteor","sass","scss"],"latest_commit_sha":null,"homepage":"","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/Meteor-Community-Packages.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":["storytellercz","jankapunkt"],"patreon":null,"open_collective":null,"ko_fi":null,"tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"otechie":null,"lfx_crowdfunding":null,"custom":null}},"created_at":"2013-04-19T00:18:12.000Z","updated_at":"2025-04-24T18:24:07.000Z","dependencies_parsed_at":"2025-04-01T08:52:42.475Z","dependency_job_id":null,"html_url":"https://github.com/Meteor-Community-Packages/meteor-scss","commit_stats":{"total_commits":196,"total_committers":40,"mean_commits":4.9,"dds":0.7653061224489796,"last_synced_commit":"da7801705025b9cfe645bc712751a5030235b79a"},"previous_names":[],"tags_count":28,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Meteor-Community-Packages%2Fmeteor-scss","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Meteor-Community-Packages%2Fmeteor-scss/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Meteor-Community-Packages%2Fmeteor-scss/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Meteor-Community-Packages%2Fmeteor-scss/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Meteor-Community-Packages","download_url":"https://codeload.github.com/Meteor-Community-Packages/meteor-scss/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254436948,"owners_count":22070947,"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","hacktoberfest","meteor","sass","scss"],"created_at":"2024-09-24T19:44:06.021Z","updated_at":"2025-05-15T23:06:51.896Z","avatar_url":"https://github.com/Meteor-Community-Packages.png","language":"JavaScript","funding_links":["https://github.com/sponsors/storytellercz","https://github.com/sponsors/jankapunkt"],"categories":[],"sub_categories":[],"readme":"# Sass for Meteor\nThis is a Sass build plugin for Meteor. It compiles Sass files with node-sass.\n\n**Note that due to a limitation in libsass, there is no support for imports with indented syntax (sass). Indented syntax does work on the top-level. A version based on dart-sass is in the works which should remove this limitation.**\n\n**Meteor 1.7 introduced a change in how node_modules are handled, if you want to import sass from a node_module you need to symlink the package in your imports directory (more information below)**\n\n## Installation\n\nInstall using Meteor's package management system:\n\n```bash\n\u003e meteor add fourseven:scss\n```\n\nIf you want to use it for your package, add it in your package control file's\n`onUse` block:\n\n```javascript\nPackage.onUse(function (api) {\n  ...\n  api.use('fourseven:scss');\n  ...\n});\n```\n\n## Compatibility\n\u003ctable\u003e\n\u003cthead\u003e\n\u003ctr\u003e\u003cth\u003eMeteor Version\u003c/th\u003e\u003cth\u003eRecommended fourseven:scss version\u003c/th\u003e\u003c/tr\u003e\n\u003c/thead\u003e\n\u003ctbody\u003e\n\u003ctr\u003e\u003ctd\u003e1.0 - 1.1\u003c/td\u003e\u003ctd\u003e3.2.0\u003c/td\u003e\u003c/tr\u003e\n\u003ctr\u003e\u003ctd\u003e1.2 - 1.3.1\u003c/td\u003e\u003ctd\u003e3.4.2\u003c/td\u003e\u003c/tr\u003e\n\u003ctr\u003e\u003ctd\u003e1.3.2+\u003c/td\u003e\u003ctd\u003e3.8.0_1\u003c/td\u003e\u003c/tr\u003e\n\u003ctr\u003e\u003ctd\u003e1.4.0\u003c/td\u003e\u003ctd\u003e3.8.1\u003c/td\u003e\u003c/tr\u003e\n\u003ctr\u003e\u003ctd\u003e1.4.1+\u003c/td\u003e\u003ctd\u003e4.5.4\u003c/td\u003e\u003c/tr\u003e\n\u003ctr\u003e\u003ctd\u003e1.6+\u003c/td\u003e\u003ctd\u003e4.12.0\u003c/td\u003e\u003c/tr\u003e\n\u003c/tbody\u003e\n\u003c/table\u003e\n\nSince `meteor 1.4.1+` (`fourseven:scss 3.9.0+`), we do not have prebuild binaries anymore. You are required to set up the [required toolchain](https://github.com/nodejs/node-gyp) yourselves.\n\n## Usage\nWithout any additional configuration after installation, this package automatically finds all `.scss` and `.sass` files in your project, compiles them with [node-sass](https://github.com/sass/node-sass), and includes the resulting CSS in the application bundle that Meteor sends to the client. The files can be anywhere in your project.\n\n### File types\n\nThere are two different types of files recognized by this package:\n\n- Sass sources (all `*.scss` and `*.sass` files that are not imports)\n- Sass imports/partials, which are:\n  * files that are prefixed with an underscore `_`\n  * marked as `isImport: true` in the package's `package.js` file:\n    `api.addFiles('x.scss', 'client', {isImport: true})`\n  * Starting from Meteor 1.3, all files in a directory named `imports/`\n\nThe source files are compiled automatically (eagerly loaded). The imports are not loaded by\nthemselves; you need to import them from one of the source files to use them.\n\nThe imports are intended to keep shared mixins and variables for your project,\nor to allow your package to provide several components which your package's\nusers can opt into one by one.\n\nEach compiled source file produces a separate CSS file.  (The\n`standard-minifiers` package merges them into one file afterwards.)\n\n### Importing\n\nYou can use the regular `@import` syntax to import any Sass files: sources or\nimports.\n\nBesides the usual way of importing files based on the relative path in the same\npackage (or app), you can also import files from other packages or apps with the\nfollowing syntax.\n\nImporting styles from a different package:\n\n```scss\n@import \"{my-package:pretty-buttons}/buttons/_styles.scss\";\n\n.my-button {\n  // use the styles imported from a package\n  @extend .pretty-button;\n}\n```\n\nImporting styles from the target app:\n\n```scss\n@import \"{}/client/styles/imports/colors.scss\";\n\n.my-nav {\n  // use a color from the app style pallete\n  background-color: @primary-branding-color;\n}\n```\n\nThis can also conveniently be used to import styles from npm modules for example:\n```scss\n@import \"{}/node_modules/module-name/stylesheet\";\n```\n\nNote that **Meteor 1.7** introduced a change so that files in `node_modules` aren't automatically compiled any more.\nThis requires you to add a symlink inside the `imports` directory to the pacakge in order for compilation to work.\nE.g.\n\n```\nmeteor npm install the-package\ncd imports\nln -s ../node_modules/the-package .\n```\n\nSee the [meteor changelog](https://github.com/meteor/meteor/blob/devel/History.md) for more information.\n\n#### Global include path\n\nSometimes a 3rd party module uses import paths that assume that the compiler is\nconfigured with specific `includePaths` option (e.g. Ionic, Bootstrap, etc.):\n```scss\n@import \"ionicons-icons\"; // This file is actually placed in another npm module!\n```\n\nCreate a configuration file named \"`scss-config.json`\" at the root of your Meteor\nproject to specify include paths that the compiler should use as an extra\npossibility to resolve import paths:\n```json\n{\n  \"includePaths\": [\n    \"{}/node_modules/ionicons/dist/scss/\"\n  ]\n}\n```\n\n\n### Sourcemaps\nThese are on by default.\n\n### Autoprefixer\nAs of Meteor 1.2 autoprefixer should preferably be installed as a separate plugin. You can do so by running:\n\n```\nmeteor remove standard-minifiers\nmeteor add seba:minifiers-autoprefixer@0.0.2\n```\n\nIn a Meteor 1.3+ project, do the same by running:\n```\nmeteor remove standard-minifier-css\nmeteor add seba:minifiers-autoprefixer\n```\n\n## LibSass vs Ruby Sass\nPlease note that this project uses [LibSass](https://github.com/hcatlin/libsass). LibSass is a C++ implementation of the Ruby Sass compiler. It has most of the features of the Ruby version, but not all of them. Things are improving, so please be patient. Before you ask, I have no intention of making a version of this package that links to the Ruby version instead.\n\nFor a quick rundown on what libsass does and doesn't (currently) do, [check here](http://sass-compatibility.github.io/).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmeteor-community-packages%2Fmeteor-scss","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmeteor-community-packages%2Fmeteor-scss","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmeteor-community-packages%2Fmeteor-scss/lists"}