                        課程
                    
                        /前端開(kāi)發(fā)
                        
                            /React.JS
                        
                        /React實(shí)戰(zhàn)--打造畫(huà)廊應(yīng)用（上）

json-loader問(wèn)題

請(qǐng)問(wèn)新版本的json-loader是不是不需要在配置文件里寫(xiě)了，直接安裝好，然后require()進(jìn)來(lái)？

willerfu

2016-10-24

源自：React實(shí)戰(zhàn)--打造畫(huà)廊應(yīng)用（上） 3-2

關(guān)注問(wèn)題我要回答

2415

操作

收起

2 回答

33852140 回答被采納 +3 積分
2016-10-25

我配置在文件里，也可以使用，而且這樣不用每個(gè)需要使用到的文件到require()進(jìn)來(lái)，相對(duì)來(lái)說(shuō)更簡(jiǎn)單吧

0 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

#1

willerfu 提問(wèn)者

感謝

2016-10-26 回復(fù) 有任何疑惑可以回復(fù)我~

#2

willerfu 提問(wèn)者

還有我想問(wèn)，如果我在loader那里聲明了josn-loader，那我不require(),那我如何獲取 imageDatas，不是imageDatas 是通過(guò)json文件讀取到的嘛？可以列出下你的配置部分代碼，和你獲取imageDatas的代碼片段嘛？

2016-10-26 回復(fù) 有任何疑惑可以回復(fù)我~

33852140
2016-10-27

json-loader是用來(lái)加載json文件的，沒(méi)有的話無(wú)法加載寫(xiě)的文件。寫(xiě)在配置文件里就可以了

而 require() 是把我們寫(xiě)的文件讀取進(jìn)來(lái)，至于怎么實(shí)現(xiàn)的就是交給loader進(jìn)行處理的。

下面讀取信息是按照 ES6 規(guī)范寫(xiě)的代碼

//獲取圖片相關(guān)數(shù)據(jù)
let?imgData?=?require('../data/imageDatas.json');

//獲取圖片相關(guān)信息,轉(zhuǎn)化圖片URL路徑信息
imgData?=?imgData.map(x=>{
??x.imgUrl?=?require('../images/'+x.fileName);
??return?x;
});

配置的話，就是正常的配置，不過(guò)新版本的是在 cfg 文件夾下的 default.js 中

loaders:?[
?????//?省略了部分內(nèi)容
??????{
????????test:?/\.styl/,
????????loader:?'style-loader!css-loader!postcss-loader!stylus-loader'
??????},
??????{
????????test:?/\.json$/,
????????loader:'json-loader'
??????},
??????{
????????test:?/\.(mp4|ogg|svg)$/,
????????loader:?'file-loader'
??????}
????]

1 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

#1

willerfu 提問(wèn)者

嗯嗯，感謝，明白了

2016-10-29 回復(fù) 有任何疑惑可以回復(fù)我~