quiksass vscode plugin
VSCode plugin to compile .scss files.
It generates the .css and .min.css files for the given .scss file, on every save.
The plugin gets activated by opening .scss files.
You can install altoscode.quiksass from the VSCode Marketplace as appropriate.
This VSCode extension is released under MIT license.
Check Dart implementation of SASS for more details.
It does not depend on
node-sass (or indirectly the platform-specific
libcss either !).
It automatically imports node-sass-package-importer as well.
So it is possible to use the following the import notation in the scss files.
Assume, we define a dependency in package.json as below (say, sass-mq).
We should pull the npm modules in the
node_modules directory as below.
$ npm i
The above command will pull the node modules from npm to
node_modules directory at the same level as package.json.
Then, we can import the package,
sass-mq in our scss file using a shorthand notation starting with
~ as below.
The plugin will include the modules defined in
package.json (and hence, the generated modules present in the
node_modules directory) when transpiling the .scss files inline.
By default, it looks for packages in
package.json in the root directory of the current project. ( and hence, the packages in
To customize the same, check
quiksass.sassWorkingDirectory. More details below in extension settings.
This extension contributes the following settings:
quiksass.debug: Default: false. Sets the debug flag for debugging the extension. For developers only.
quiksass.includePath: Default: . Set of directories to be specified as includePath for sass compilation.
quiksass.sassWorkingDirectory: Default: Project Root. The working directory from which to run the sass compiler to be used by
node-sass-package-importer. This can be an absolute directory or a directory, relative to project root.
quiksass.disableMinifiedFileGeneration: Default: False. Flag to disable minified file generation. Minified files are generated by default.
See CHANGELOG for more details.