normalize-scss with hugo

Before beginning to develop the CSS for this website, I wanted to ensure I had a consistent base style across all browsers. Originally I was going to use reset.css but upon further research decided to use normalize.css because it normalizes everything to sensible defaults rather than zeroing everything out, among other benefits.

When trying to hook up normalize.css into this hugo powered website I ran into trouble because I am using SASS. To resolve this, I switched to using normalize-scss instead to make it easier to include.

By using the --include-path option in my SASS build script to include the directory node_modules/normalize-scss/sass/ (as described in Approach 2 of the normalize-scss README), I can then use @import "normalize/import-now"; in my SCSS to include the normalized styles.

For reference my package.json (with the irrelevant parts removed) is as follows:

{
  "name": "example-theme-hugo",
  "version": "0.0.1",
  "description": "Example for notes",
  "scripts": {
    "start": "npm run sass:build && parallelshell 'npm run sass:watch' 'npm run serve'",
    "sass:build": "node-sass --include-path node_modules/normalize-scss/sass/ assets/scss/main.scss static/css/style.css",
    "sass:watch": "onchange 'assets/scss/**/*.scss' -- npm run sass:build",
    "serve": "hugo serve --buildDrafts"
  },
  "devDependencies": {
    "node-sass": "^4.7.2",
    "normalize-scss": "^7.0.1",
    "onchange": "^3.3.0",
    "parallelshell": "^3.0.2"
  }
}

And my assets/scss/main.scss is (work-in-progress!):

@import "normalize/import-now";

body {
  background: pink;
}