create-react-app 創(chuàng)建的項(xiàng)目中引用less/sass

問題描述

按照官網(wǎng)的配置加入了sass，但是有兩處不足的地方，不知道在配置上還能否優(yōu)化
https://github.com/facebook/c...

一個是不能在組件中直接引用.scss文件，只能引用編譯后的.css（代碼如下）；另一個問題是每次新建一個.scss,node-sass-chokidar貌似并不能監(jiān)聽到變化然后重新編譯，需要手動重啟項(xiàng)目才行

相關(guān)代碼

Tabs.jsx

import React ,{Component} from 'react'
// 這里無法直接引用main.scss文件
// import '../../stylesheets/main.scss'
// 只能引用編譯后的.css文件
import '../../stylesheets/main.css'

class Tabs extends Component{
    // eslint-disable-next-line
    // constructor(props){
    //     super(props)
    // }
    
    render(){
        return <div className="tabs">tabs</div>
    }
}

export default Tabs

package.json

"scripts": {
    "build-css": "node-sass-chokidar src / -o src /",
    "watch-css": "npm run build-css && node-sass-chokidar src / -o src / --watch --recursive",
    "_start": "react-scripts start",
    "_build": "react-scripts build",
    "start-js": "react-scripts start",
    "start": "npm-run-all -p watch-css start-js",
    "build-js": "react-scripts build",
    "build": "npm-run-all build-css build-js",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  }

請問我配置有問題嗎？有沒有更優(yōu)的選擇？