（陣營+的WebPack）形象開發中，但不生產（文件裝載機+圖像的WebPack裝載機）

Question

一切都在發展的偉大工程，但是當我嘗試建立生產，圖像不顯示在這一頁。他們確實顯示在正確的文件夾中（即我的生產文件夾中有圖像子文件夾，圖像存在）。當我查看瀏覽器中的文件夾（源）時，圖像文件夾不存在。由於某些原因，即使webpack正在構建它，似乎反應版本並不知道該文件夾。我猜這是一個反應問題，而不是一個webpack問題，但我仍然對這兩個問題都陌生。我發現的所有資源似乎都表明，我擁有的東西應該有效，但我覺得我錯過了一些東西。

webpack.config.js：

rules: [ 
     ... 
     { 
     test: /\.(jpe?g|png|gif|svg)$/i, 
     use: [ 
      'file-loader?name=[name].[ext]&publicPath=/&outputPath=images/', 
      'image-webpack-loader' 
     ] 
     }, 
    ] 

在使用中：

<img src={ require('./images/shopping-cart.png') } alt="shopping cart" /> 

編輯：我現在已經顯示了它（表面上）的圖像的圖像文件夾，但是，圖像已完全破碎。即使只是從瀏覽器中檢查文件夾也不起作用。

Answer 1

如此看來，答案只是改變「/」到「./」和‘圖像/’到「./images/」。我通過實驗得出了這個結論。希望答案可以幫助其他人。

rules: [ 
      ... 
      { 
      test: /\.(jpe?g|png|gif|svg)$/i, 
      use: [ 
       'file-loader?name=[name].[ext]&publicPath=./&outputPath=./images/', 
       'image-webpack-loader' 
      ] 
      }, 
     ]