React JS - 加載圖片問題

我一直在加載圖片，我已經搜索了所有的來源，並且我沒有找到任何答案。它下面的代碼不工作React JS - 加載圖片問題

import goldImage from './../../../public/img/gold.png';

，但是當我這樣寫，它的工作原理：

const gold = '../../../public/img/gold.png';

或者，如果我導入JPG文件，它的工作原理：

import test from './../../../public/img/kaslie.jpg';

我還使用的WebPack 2，這裏是我的代碼：

test: /\.(png|jpe?g|gif|svg)$/, 
      use:[ 
       { 
       loader: 'url-loader', 
       options:{limit:40000,name:'[path][name].[ext]?[hash]'} 
       }, 
       'image-webpack-loader?bypassOnDebug&optimizationLevel=7&interlaced=false' 
      ]

我對此沒有任何想法，爲什麼它只能用於jpg文件，但PNG文件不起作用。

來源

2017-04-11 Kaslie

對於圖像，你應該使用：

const goldImage = require('./../../../public/img/gold.png'); 

<image src{goldImage} alt="" />

import語句用於導入已從外部模塊，另一個腳本等

來源

2017-04-11 08:02:29

導出函數，對象或原語，但我使用import語句導入JPEG文件的圖像，它的工作原理是，如果我使用const，圖像將不會被webpack url-loader或file-loader捕獲。謝謝你的迴應。 – Kaslie

React JS - 加載圖片問題

回答

相關問題