Angular 2 - how to use scss with bootstrap 4 in testing using webpack

I have issues with using scss files while testing in angular 2.2.1. My component is compiled fine, but it not working with testing. I am using angular 2 starter seed, the original code using css in their code. In webpack test / common, I had added this configuration to webpack:

{
  test: /\.scss$/,
  loaders: ['raw-loader', 'sass-loader']
}

My component code:

@Component({
  selector: 'app',
  encapsulation: ViewEncapsulation.None,
  styleUrls: [
    './scss/application.scss'
  ]
})

The 1st error message I got is:

Failed to load assets/scss/application.scss
        invoke@spec-bundle.js:6807:35
        run@spec-bundle.js:6700:51

I suspect the error due to in spec-bundle.js file, I didn't include bootstrap 4 scss, application

The 2nd error code I got after copied bootstrap 4 scss into my code:

  color: $text-color;
          ^
        Undefined variable: "$text-color".

I am pretty sure my scss files are fine, since I can compile and run. I have no clue at this point how to resolve this issue. An