Node-sass: inject data

[avetisk]

It would be great to be able to inject directly data before processing files, for instance to set dynimicaly some variables, etc.

Example:

sass.render({
  'file': entryFile,
  'inject': '$assets_path: "/path/to/assets";'
  ...
});

[xzyfer]

This is unlikely to be implemented in node-sass core. Having code magically injected like this affects code portability which is a _feature_ of Sass.

---

There is however a work around for switching variable values that I use and suggest to others. I've discussion in depth how to do so in https://github.com/sass/node-sass/issues/965#issuecomment-103384773.

[yordis]

@xzyfer Why you wouldn't implement this? because this resolve a lot of problem trying to get some automated processes. I am dealing with this problem right now.

Let say I have this in my site.scss file

@import "${themesFolder}/globals/site.variables";

// definition of my CSS

I have a gulp environment where I find the divinci.json configuration where you setup the value of the theme. Look something like this.

{
  "theme": "default",
  "paths": {
    "source": "path/to/stylesheets",
    "output": "dist/"
  }
}

I want to keep my site.scss clean because depend of my theme config the URL will change I do need something like pass dynamic variable from my gulp file.

For example:
themesFolder: config.paths.source + '/themes/' + config.theme

[mgreter]

FYI: This is pretty much covered and available on the libsass side by custom headers ...

[xzyfer]

My current position is that we will not add this feature. It's easy enough for you to modifies the file contents and pass to render.

require('node-sass').render({ data: ... });

Separate to this is having the file's path exposed within node-sass for things like custom importers. This is already being tracked in https://github.com/sass/node-sass/issues/1195.

[yordis]

@xzyfer @mgreter can you help me out and tell me how to resolve my problem? I am using Less right now just because I can't do something like this

[xzyfer]

Something like this should point you in the right direction.

var data = require('fs').readFile('/path/to/file.scss', function(err, data) {
  if (err) throw new Error(err);
  require('node-sass').render({
    data: '$assets_path: "/path/to/assets";' + data
  }, function(err, res) {
      if (err) throw new Error(err);
      console.log(res.css.toString());
  });
});

[yordis]

@xzyfer oh so data can be use for put some dynamic string. Thanks a lot

[dylanized]

@xzyfer thanks again for this

I am trying to inject a JSON object into a SCSS file. I wish there was a way to do this that was cleaner than prepending a string to the file contents.