react create-react-app 怎么添加sass

番茄西紅柿發(fā)布于2019-04-23 13:33 / 2725人閱讀

摘要：一先上官方文檔二臨時(shí)解決方法安裝到目錄下找到文件，進(jìn)行添加，詳細(xì)位置看下圖三推薦使用當(dāng)然了，不介意去改配置，多人開發(fā)時(shí)需要每個(gè)人都去修改，是不合理的。最好先把包拉到項(xiàng)目里，然后再修改。

一、先上官方文檔

https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-a-css-preprocessor-sass-less-etc

二、臨時(shí)解決方法

1.安裝

npm install sass-loader node-sass --save-dev

2.到目錄 node_modules/react-scripts/config 下找到 webpack.config.dev.js 文件，進(jìn)行添加，詳細(xì)位置看下圖

{
            test: /.scss$/,
            loaders: [style-loader, css-loader, sass-loader],
          }

三.推薦使用

當(dāng)然了，不介意去node_modules 改配置，多人開發(fā)時(shí)需要每個(gè)人都去修改，是不合理的。最好先把config包拉到項(xiàng)目里，然后再修改。

GPU云服務(wù)器云服務(wù)器 create-react-app 怎么部署react項(xiàng)目 sass 多云管理 sass

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://specialneedsforspecialkids.com/yun/2036.html

相關(guān)文章

create-react-app 中添加sass less以及配置全局變量

摘要：由于中沒(méi)有內(nèi)置或者這種預(yù)編譯的工具這篇文章即為如何添加或者工具暴露配置首先全局下載創(chuàng)建一個(gè)項(xiàng)目然后暴露出的配置這里需要注意的是這個(gè)命令則是暴露出配置的命令添加然后安裝找到文件中的中找到在它里面已經(jīng)配置了很多由于create-react-app中沒(méi)有內(nèi)置sass或者less這種預(yù)編譯的工具, 這篇文章即為如何添加sass或者less工具. 暴露webpack配置首先全局下載creat...

mindwind 2019-08-22 16:10 評(píng)論0 收藏0
react 項(xiàng)目構(gòu)建

摘要：配置方式找到文件如需添加路由則在里面添加，同時(shí)需要后端更改配置除了上面的路徑，其他路徑全部指向單頁(yè)應(yīng)用多路由預(yù)渲染指南使用說(shuō)明源碼為方便快速構(gòu)建項(xiàng)目，本例所有配置的代碼均放在項(xiàng)目中。寫在前面每次構(gòu)建react項(xiàng)目的時(shí)候都會(huì)配置一大堆東西，時(shí)間久了就會(huì)忘記怎么配置。為了方便自己記憶也為了其他開發(fā)者在構(gòu)建react應(yīng)用時(shí)能夠快速開發(fā)，故作此記錄。本項(xiàng)目基于 create-react-...

ACb0y 2019-08-23 11:54 評(píng)論0 收藏0
如何使create-react-app創(chuàng)建的react項(xiàng)目支持sass

摘要：前言打包同樣是用的，所以使其支持其實(shí)是和我們自行初始化的項(xiàng)目一樣的，只是的配置文件所在目錄不一樣。下面是操作步驟首先安裝和兩個(gè)依賴。前言 create-react-app打包同樣是用的webpack，所以使其支持sass其實(shí)是和我們自行初始化的項(xiàng)目一樣的，只是webpack的配置文件所在目錄不一樣。所以只要找到配置文件所在的目錄，然后按照一般webpack的配置方法配置就好。下面是...

zhangxiangliang 2019-08-22 15:44 評(píng)論0 收藏0
初探react技術(shù)棧（一）

摘要：相信用的同學(xué)也不少找到函數(shù)在其中中添加啟用編譯。。。react 最近已經(jīng)開始使用react技術(shù)棧了，從頭開始搭建項(xiàng)目，有必要的記錄一下配置的過(guò)程以及項(xiàng)目分層的思路，這次后臺(tái)項(xiàng)目采用的主要采用react-create-app腳手架以及Ant DesignUI 以及多語(yǔ)言react-intl create-react-app 這是官方維護(hù)的腳手架應(yīng)用我們一般也采用這個(gè) $ npm or c...

劉玉平 2019-05-23 16:23 評(píng)論0 收藏0
初探React技術(shù)棧（一）

react 最近已經(jīng)開始使用react技術(shù)棧了，從頭開始搭建項(xiàng)目，有必要的記錄一下配置的過(guò)程以及項(xiàng)目分層的思路，這次后臺(tái)項(xiàng)目采用的主要采用react-create-app腳手架以及Ant DesignUI 以及多語(yǔ)言react-intl create-react-app 這是官方維護(hù)的腳手架應(yīng)用我們一般也采用這個(gè) $ npm or cnpm $ npm install create-react...

neroneroffy 2019-08-26 13:53 評(píng)論0 收藏0