This Typescript plugin hooks itself into the Typescript Language Service to provide intellisense and validation for SCSS imports as CSS Modules.

It supports .module.scss imports containing valid SCSS code.

The following SCSS (and CSS Modules) feature are supported:

// :global and :local identifier and functions
:global .global-class { }
:global(.global-class) { }
:local .local-class { }
:local(.local-class) { }

// Variables
$color: red;
.className {
  color: $color;
}

// Loops
$color: red;
@for $section from 1 to 5 {
    .section-#{$section} {
        color: $color;
    }
}

Also imports are supported.
As of now there's also a limited path-resolution support to allow module imports.

@import "./relative/path/some/file";

@import "absolute/path/some/file";

Thanks to Microsoft and their nice Language-Service-Plugin documentation.

• motivated by facebook/create-react-app#5677
• inspired by timothykang/css-module-types