Hi Jay, thanks for the nice comment! To answer your questions:

1) I agree that is you’re working with a CSS pre-processor then ideally you don’t want to check in the generated CSS – they’re basically build artifacts. This is exactly what I ended up doing here, but annoyingly have since moved on from the project and forgot to write it up!

From memory, I referenced the generated CSS in my Views but didn’t include them in source control. I modified the csproj to add the generated CSS in the “BeforeBuild” Target section, but don’t believe there were any other changes. If it doesn’t work let me know and I’ll spend some time digging into it.

2) Yes, I’ve actually had the 4th part mostly written and sitting in my drafts for a while now, but just started a new contract which has eaten up my time. I promise I will finish it off and publish ASAP!

These are great articles! Been looking at bunch of blogs and articles but none of them give a clear bigger picture – especially when it comes to how to handle the development and deployment evironments – min vs not to min etc

2 questions:
In the previous post you have the scss to css – so i’m guessing for the above to work you are checking-in your css along with scsss to source control? With multiple devs working and updating same scss files – the css changes can be quite noisy. I suppose it the release build could do those steps too.

Are you planning to write the next 2 articles in this series? Would be nice to know how you fit testing+linting into the CI pipeline and gulp

Hi Eugene – there is only one _Layout.cshtml page in the usual Views/Shared folder. You can see the file as it is today here. In there, there is a section at the top for CSS and one at the bottom for JavaScript. For example, here’s the JavaScript block:


< ! -- build:js /dist/libs.js - - >
< script src="/Scripts/Libraries/jquery.js">< / script >
< script src="/Scripts/Libraries/bootstrap.js">< / script >
< script src="/Scripts/Libraries/respond.js">< / script >
< ! -- endbuild - - >

(NB I’ve had to put some extra spaces in there as WordPress doesn’t like the code!)

The Gulp task will then run on a release build, and change this block into one minified and concatenated file which is then referenced in the same _Layout.cshtml page. So the entire block above will get replaced with the following:


< script src="/dist/libs-204324b1dd.js" >< / script >


So, we only have one _Layout.cshtml page with sections that get replaced when we build for a release.

Hope this answers your question!

Hi Alex, unfortunately I haven’t used Visual Studio online so can’t say for sure why this happening. Does it come up with any error messages?