Search code examples
visual-studiosassintellisensevisual-studio-2019tooling

How can you use Reference Paths for multiple SCSS Files in Visual Studio, to utilize Intellisense, without having to add it to every file?


In Visual Studio you can include reference paths within your SASS/SCSS files using the following syntax within a .scss file:

/// <reference path="vars.scss" />

This is very helpful for providing intellisense for SASS variables and mixins. Right now I have to add a reference path manually to every single SASS file to get this benefit.

Is there a way to define "global" Reference Paths for your sass files, where you could define a path once, so that it is available in ALL sass files going forward?

I'm running into an issue where I want to reference multiple SASS files from various packages, but do not want to have to add multiple reference paths to every single SASS file.

On another note: does someone know where there is documentation on <reference path=""> for visual studio?


Solution

  • I'm running into an issue where I want to reference multiple SASS files from various packages, but do want to have to add multiple reference paths to every single SASS file.

    I think you can just define a global file named _references.scss and then put all referenced scss files into it. This file must be located in the folder named Css which you at the root of your project.

    Then add like these into _references.scss

    /// <reference path="vars.scss" />
    /// <reference path="content.scss />
    /// <reference path="background.scss" />
    

    When you want to use it, just reference the unique global file _reference.scss.

    Hope it could help you.