脚本宝典收集整理的这篇文章主要介绍了在create-react-app中使用sass，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

在create-react-app中使用sass
1、安装node-sass-chokidar到依赖

  npm install --save node-sass-chokidar

2、安装node-sass

  npm install node-sass

3、在项目的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",

4、使用
创建xx.scss文件，或者将初始化项目中的src/App.css重命名为src/App.scss，在终端运行

  npm run watch-css

watch-css将在src子目录中找到每个Sass文件，并在其旁边创建一个相应的CSS文件
5、同时编译sass和运行项目
（1）可以打开两个终端，一个终端执行npm start运行项目，另一个终端执行npm run watch-css进行同步编译
（2）使用npm-run-all工具，执行npm install npm-run-all --save-dev安装,在在项目的package.json中，将以下行添加到scripts中:

"run-double": "npm-run-all -p watch-css start"

在终端执行npm run run-double,可同时运行项目和编译sass
*注："run-double"这个名称可改为自己喜欢的名称
6、推荐
更改create-react-app的webpack配置,一般使用react-app-rewired来处理

脚本宝典总结

以上是脚本宝典为你收集整理的在create-react-app中使用sass全部内容，希望文章能够帮你解决在create-react-app中使用sass所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。