Node-SASS源映射不适用于React-JS

Question

我正在尝试将SASS与REACT一起使用

虚拟GITHUB：https://github.com/bansalvks/react-poc-collection/tree/master/scss-with-react

我面临的问题是源地图无法正常工作。

我正在使用node-sass-chokidar并使用以下脚本来运行该实用程序 node-sass-chokidar --include-path ./node_modules/ ./src -o ./src --output-style=expanded --source-map=true --source-map-root=true --watch

在下面的屏幕快照中您可以看到文件没有出现

Answer 1

此功能可与 create-react-app 一起使用，但您可以尝试自己的反应设置

尝试一下：

在“虚拟” Github网页上，我发现了这一点：

https://github.com/facebook/create-react-app/issues/5707

  

以下对我有用：

1.) open node_modules\react-scripts\config\webpack.config.js
2.) replace "isEnvProduction" with "isEnvDevelopment" for the css-loader, css-module loader, sass loader and sass module loader
(between lines 443 - 500)
3.) start development process with "npm start"

因此，只需导航至 node_modules \ react-scripts \ config \ webpack.config.js

第443-500行之间搜索：

• css-loader
• css-module
• 加载程序
• sass-loader
• sass-module-loader

并将 isEnvProduction 替换为 isEnvDevelopment

https://user-images.githubusercontent.com/11925409/50423483-4b986900-0856-11e9-80bb-7f7f331e17fd.png

我已经尝试过了，现在源地图正在chrome开发人员工具中工作