Skip to content

CSS

Resources

Seo

Linting CSS and SCSS

  • Install stylelint, stylelint-config-standard
    • npm install stylelint stylelint-config-standard
  • Add stylelint in package.json
  "stylelint": {
    "plugins": [
      "stylelint-scss"
    ],
    "extends": "stylelint-config-standard"
  }

Stylelint Notes

  • stylelint-config-sass-guidelines - scss stylelint rules
  • Stylelint webpack plugin
    • const StylelintPlugin = require('stylelint-webpack-plugin')
    • new StylelintPlugin({syntax: 'scss', emitErrors: false, lintDirtyModulesOnly: true})
  • stylelint
    • npm install --save-dev stylelint stylelint-config-sass-guidelines stylelint-config-standard stylelint-scss stylelint-webpack-plugin
  • config in package.json
"stylelint": {
    "plugins: [
        "stylelint-scss"
}

PostCSS Notes

Font Awesome

.a:after {
    // Import mixin from font-awesome/scss/mixins.scss
    @include fa-icon();

    // Use icon variable from font-awesome/scss/variables.scss
    content: $fa-var-exclamation-triangle;
}