I'm trying to learn how to silence a rule in SublimeLinter-scss-lint (specifically EmptyLineBetweenBlocks).
For SublimeLinter-csslint, I can run scss-lint --list-rules in Terminal, locate the rule I don't like in the output, and add it to the ignore array in SublimeLinter.sublime-settings (as below).
{
"user": {
// ...
"linters": {
"csslint": {
// ...
"ignore": [
// Following rules will be ignored.
"adjoining-classes",
"box-model",
"box-sizing",
"fallback-colors",
"ids",
"universal-selector"
],
// ...
},
// ...
}
}
}
For SCSS, there doesn't appear to be a similar way to find rule names in Terminal, and there's no scss-lint object in Sublime Linter settings. So…how is this done?
Thank you.
Here's a way I found to make it work.
I created a file in my Home directory (~/) named .scss-lint.yml.
In it, I copy–pasted rules I wanted to modify from the default.yml file located in/Library/Ruby/Gems/2.0.0/gems/scss_lint-0.39.0/config/, preserving indentation.
Close and re-open any SCSS files in Sublime to see the changes.
Example:
linters:
EmptyLineBetweenBlocks:
enabled: false
LeadingZero:
enabled: true
style: include_zero
MergeableSelector:
force_nesting: false
Related
I'm trying to use CSSLint with Sublime Text 3, but I can't seem to get it to use the .csslintrc file I've got in my project root.
Originally I thought it would be in JSON format, but then it turned out you have to use a command line syntax, so as a test I tried these in my .csslintrc file:
--ignore=ids,important
and
ignore=ids,important
But neither stop the linter from warning about the use of either??? Any suggestions? It does work if I just stick it in the user settings file, but since I use .jshintrc and other files in my projects for linting etc, and not everyone uses Sublime Text (I don't know why they wouldn't :), I'd prefer to have it all in .csslintrc
"linters": {
"csslint": {
"#disable": false,
"args": [],
"errors": "",
"excludes": [],
"ignore": "ids,important", // WORKS
"warnings": ""
},
}
First solution, you can add a .csslintrc file in the CSS folder (and duplicate it for each sub folder...) :
--ignore=ids,important
Otherwise, you can add a .sublimelinterrc file in your project root :
{
"linters": {
"csslint": {
"ignore": ["ids, important"]
}
}
}
When using SublimeLinter-scss-lint with my SASS files it throughs up errors for common things like,
indentation should be 2 spaces not 4 spaces, colan after property should be followed by one space etc etc.....how can get sublime to ignore these and just watch out for more important errors??
You can disable or configure each linter component of the scss linter plugin for Sublime Text 3. You just need to configure the user settings.
Go to:
Sublime Text Menu
-> Preferences
-> Package Settings
-> SublimeLinter
-> Settings - User
By default, this file is stored at the path below, but may not exist if you haven't configured any settings yet.
~/Library/Application Support/Sublime Text 3/Packages/User/SublimeLinter.sublime-settings
The basic structure of this file, in terms of linter plugins, is shown below and will vary based on what you have set and what plugins you are already using. (I have removed most of the other settings to focus on what is important for configuring the scss plugin.)
{
"user": {
... more settings ...
"linters": {
"csslint": {
...
},
"htmltidy": {
...
},
"jshint": {
...
},
"json": {
...
},
"php": {
...
},
"scss": {
"#disable": false,
"args": [],
"exclude-linter": "Indentation SpaceAfterPropertyColon",
"excludes": [],
"include-linter": ""
},
"xmllint": {
...
}
},
... more settings ...
}
}
The important bit that you want is under the "linters" -> "scss" section. You can explicitly list linters in the scss plugin to include or exclude.
Full list of default SCSS linters
As the configuration is set up above, it should disable both the Indentation and SpaceAfterPropertyColon linters for scss. You can add as many as you want to this list.
SublimeLinter documentation for the settings file
Is there a way with the new Sass (3.3+) to disable the source maps by default? Right now I keep getting main.css.map (403 Forbidden) when I view inspector. It looks like it gets generated by default, but I would like to disable it.
Any ideas?
The grunt-contrib-sass module accepts a property in 'options' called 'sourcemap'.
grunt.initConfig({
sass: {
dist: {
files: {
'main.css': 'main.scss'
},
options: {
'sourcemap': 'none'
}
}
}
});
Documentation
Setting the value to "none" should prevent the creation of a sourcemap.
The 'sourcemap': 'none' option will no longer be valid as it was true for Ruby SASS which is no longer supported.
Use one of the following ways instead:
options: {
'no-source-map': ''
}
OR
options: {
sourceMap: false
}
Is there a version of grunt-processhtml for SASS/LESS ?
In my scss I need to set variable $icon-font-path (yes, bootstrap) to different values depending whether we are in dev mode or we are assembling production code.
The last thing I want to do is to move the variable declaration to a separate file (dev & prod version) and substitute them in my build process.
My Gruntfile: https://github.com/vucalur/django-wibses/blob/master/wibses/yo/Gruntfile.js
Sure there is a way, use importPath option of https://github.com/gruntjs/grunt-contrib-compass, which would make files under the specified folder findable by Sass's #import directive.
compass: {
dev: {
options: {
importPath: 'src/sass/icon-path-dev',
}
},
prod: {
options: {
importPath: 'src/sass/icon-path-prod',
}
}
And icon-path-dev will have _filepathvar.scss which would have your variable as
$icon-font-path : 'dev-font/path';
And icon-path-prod will have _filepathvar.scss which would have your variable as
$icon-font-path : 'prod-font/path';
You can then use this under your main scss file like
#import "filepathvar";
I'm trying to get this Grunt plugin to work:
https://npmjs.org/package/dss
This documentation plugin ironically seems to be lacking proper documentation. Can someone help me out by giving me an example of something that worked for them. The main thing that's screwing me up is the "your_target" property. Not sure what's suppose to go in there.
Say I have a SASS file in the following path from the root directory:
sass/main.scss
What would my ouput be by default? And where would it output to? Also what format does it ouput to?
grunt.initConfig({
DSS: {
options: {
// Task-specific options go here.
},
your_target: {
// Target-specific file lists and/or options go here.
},
},
})
Is "your_target" property the path to my sass file or the path to the documentation file I'm trying to create? Would it be defined like this?
...
your_target: {
// Target-specific file lists and/or options go here.
sass: "sass/main.scss"
},
...
I don't know what the property name should be. :(
dss: {
docs: {
options: {
},
files: {
'api/': 'css/**/*.{css,scss,sass,less,styl}'
}
}
}