Sass support

[blujedis]

Writing this in freeform as I'm not sure this is even a bug. Might not be supported.

Sass simply doesn't work even though I see react-scripts-ts appears to have the webpack config for it.

Saw a few other comments. None seem conclusive. What's clear is a default install using default react-scripts properly handles sass.

Am I missing something or is this simply not supported by react-scripts-ts?

[SolomoN-ua]

Look like guys are working on a new version that I believe will support SASS the same way as it is right now in react-script-ts, but in current version you can check this link

[blujedis]

O.K so I'm not losing it here. Moving away from sass but in some cases for bootstrap overrides it is what it is, kinda need it.

[blujedis]

Interim fix

Install node-sass and node-sass-tilde-importer

$ npm install node-sass node-sass-tilde-importer npm-run-all -D

Add the following to package.json

{
  "scripts": {
     "sass:build": "node-sass src/ -o src/ --importer=node_modules/node-sass-tilde-importer",
    "sass:watch": "npm run sass:build -- --watch --recursive",
    "source:watch": "react-scripts-ts start",
    "start": "npm-run-all --parallel sass:watch source:watch",
    "build": "npm run sass:build && react-scripts-ts build",
    "test": "react-scripts-ts test --env=jsdom",
    "eject": "react-scripts-ts eject"
  }
}

How does this work?

First we install node-sass we also add the "tilde" module so that we can import scss files from node_modules. Probably what you want if you're looking to import Bootstrap for example.

Next we install npm-run-all which allows us to fire up our watch script for scss files and start react-scripts-ts.

NOTE this will result in duplicate files. You'll end up with both style.scss and style.css. Yeah that stinks but you likely only need this for as I mentioned Bootstrap or something to override defaults.

This is my opinion, you can tell me to find a large lake and jump in it, but Sass is not really the answer anymore and we've moved away from it. For that reason to have a file or two duplicated isn't the end of the world for now.

Hopefully this helps someone out!