marksmccann / node-sass-extra

A drop-in replacement for node-sass' Node API that adds support for globs, promises and more.
MIT License
2 stars 1 forks source link

Support for Sourcemaps #18

Closed marksmccann closed 5 years ago

marksmccann commented 5 years ago

We need to consider how to handle sourcemaps –

  1. Should we enable the ability to write the source maps to disk? Would this be done via a new prop or an existing one?
  2. Should outFile and/or sourceMap be defaulted to the value of output when provided?
  3. Should outFile and/or sourceMap also support a function for a dynamic output when output is not desired?
  4. Should outFile and/or sourceMap also support a directory string similar to output?

Here are some thoughts –

In the case of ...

src/
    my-file.scss
    my-other-file.scss

Would ...

sass('src/**/*.scss', {
    output: 'dest',
    sourceMap: true
});

dest/
    my-file.css // # sourceMappingURL=my-file.sass.map
    my-other-file.css // # sourceMappingURL=my-other-file.sass.map
// writes the css to disk with the source map url included, 
// but does NOT write the source map files to disk
sass('src/**/*.scss', {
    output: 'dest',
    sourceMapOutput: 'dest'
});

dest/
    my-file.css // # sourceMappingURL=my-file.sass.map
    my-file.css.map
    my-other-file.css // # sourceMappingURL=my-other-file.sass.map
    my-other-file.css.map
// writes both the compiled css and source maps to disk
sass('src/**/*.scss', {
    output: 'dest',
    sourceMapOutput: 'dest2',
});

dest/
    my-file.css // # sourceMappingURL=../dest2/my-file.sass.map
    my-other-file.css // # sourceMappingURL=../dest2/my-other-file.sass.map
dest2/
    my-file.css.map
    my-other-file.css.map
// writes both the compiled css and source maps to disk
sass('src/**/*.scss', {
    outFile: 'dest',
    sourceMapOutput: 'dest2',
});

dest/
    my-file.css.map
    my-other-file.css.map
// writes the source maps to disk, but not the compiled css
sass('src/**/*.scss', {
    outFile: srcFile => ...,
    sourceMap: true,
});

// nothing is written to disk, but the source map is included in the output.
sass('src/**/*.scss', {
    outFile: srcFile => ...,
    sourceMap: srcFile => ...,
});

// nothing is written to disk, but the dynamic source map is included in the output.
marksmccann commented 5 years ago

Apparently in the CLI, when sourceMap is provided (either as a boolean or string), it writes it to disk. We could probably replicate the behavior on the node side? However, that would mean that it would write the sourcemaps to disk, even if the user may not want that.

marksmccann commented 5 years ago

I have been thinking about this for the past couple days. I like the idea of keeping parity between the CLI and the Node API. I am going to play with that option, to see how it feels – if both output and sourceMap are provided, both the compiled css and the source maps will be written to disk. If output is not provided, source maps will not every be written to disk. It will not be possible to write the source maps without also writing the compiled css OR vice versa. But, that might be okay. We'll see.