0

We plan on using SASS instead of plain CSS for our SharePoint project very soon. While testing and trying to set everything up, I ran into some problems:

We're using Visual Studio 2015 and on my developer machine I installed the Web Compiler Extension to compile the .scss-files and partial files to a regular .css-file.

That worked very nicely but the problem is, that there will be a few developers working simultaneously on the styles. I want to avoid merging the resulting css-file each time someone tries to check in something into source control (we're using Team Foundation Server).

Since there is a build running every time someone is checking in their changes, and to deploy the resulting solution to the nightly build machine, the idea was to somehow include the SASS compiler in the build definition. This way the more readable scss-files get merged and the build creates the resulting css-file to include it in the solution. Maybe I'm thinking too complicated, but I just couldn't get that to work so far.

Any ideas how I can achieve that? (Maybe I should also mention that none of the dev machines got any internet connection)

Jess
  • 101
  • 1
  • https://stackoverflow.com/questions/922798/how-to-ignore-files-directories-in-tfs-for-avoiding-them-to-go-to-central-source – smoore4 Feb 16 '20 at 16:19

1 Answers1

0

If you're building an MVC app, you can use MVC's bundling feature along with the SASS NuGet package. And, be sure to enable minification. There's a UseNativeMinification property on SassAndScssSettings. That way you don't need to deal with merging the css file when you get latest or check in. Reference this thread: SASS/TFS best practice

Another way is running a script (e.g with PowerShell task) on the server that to install the gulp components and then call the sass compile task to compile the SASS. Refer to Powershell build - compiling SASS for details.

Andy Li-MSFT
  • 28,712
  • 2
  • 33
  • 55
  • If you install VS on the build server with the Web Compiler Extension it will be able to compile the same has on the users machine. You then ignore css produce by the scss compiler locally (on dev machine) and not check them in. Then create and bundle them on the build side in the build. Then make the devs only work in the scss files. – Etienne Feb 17 '20 at 13:33