Updating packages and using scss.

src/frontend/components/InitialComponent.sass

@@ -1,29 +0,0 @@
-.App
-  text-align: center
-
-.App-logo
-  height: 40vmin
-  pointer-events: none
-
-@media (prefers-reduced-motion: no-preference)
-  .App-logo
-    animation: App-logo-spin infinite 20s linear
-
-.App-header
-  min-height: 100vh
-  display: flex
-  flex-direction: column
-  align-items: center
-  justify-content: center
-  font-size: calc(10px + 2vmin)
-  color: white
-
-.App-link
-  color: #61dafb
-
-@keyframes App-logo-spin
-  from
-    transform: rotate(0deg)
-
-  to
-    transform: rotate(360deg)

src/frontend/components/InitialComponent.scss

@@ -0,0 +1,38 @@
+.App {
+  text-align: center;
+}
+
+.App-logo {
+  height: 40vmin;
+  pointer-events: none;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  .App-logo {
+    animation: App-logo-spin infinite 20s linear;
+  }
+}
+
+.App-header {
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  font-size: calc(10px + 2vmin);
+  color: white;
+}
+
+.App-link {
+  color: #61dafb;
+}
+
+@keyframes App-logo-spin {
+  from {
+    transform: rotate(0deg);
+  }
+
+  to {
+    transform: rotate(360deg);
+  }
+}

src/frontend/components/InitialComponent.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import logo from '../logo.svg';
-import './InitialComponent.sass';
+import './InitialComponent.scss';
 import { Link } from "react-router-dom";
 
 const InitialComponent = () => (

src/frontend/components/OtherComponent.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import logo from '../logo.svg';
-import './InitialComponent.sass';
+import './InitialComponent.scss';
 import { Link } from "react-router-dom";
 
 const OtherComponent = () => (

src/frontend/index.tsx

@@ -8,7 +8,7 @@ import { IInitialState } from './reducers/index';
 import setStore from './setStore';
 import config from '../../config';
 
-import './styles/global.sass';
+import './styles/global.scss';
 import App from './components/App';
 import serviceWorkerRegistration from '../../serviceWorkerRegistration';
 

src/frontend/styles/global.sass

@@ -1,4 +0,0 @@
-$base-color: #282c34
-
-body
-    background-color: $base-color

src/frontend/styles/global.scss

@@ -0,0 +1,5 @@
+$base-color: #282c34;
+
+body {
+    background-color: $base-color;
+}