上破嵌套路線

Question

這裏的WebPack SCSS圖片的URL鏈接是我的目錄結構：

- public 
- src 
    - app.js 
    - assets 
    - images 
     - logo-b-green.png 
    - stylesheets 
     - nav.scss 

和：

// webpack.config.js 

module.exports = { 
    entry: './src/app.js', 
    output: { 
    path: './public', 
    filename: 'bundle.js' 
    }, 
    module: { 
    loaders: [ 
     { 
     test: /.jsx?$/, 
     exclude: /node_modules/, 
     loader: 'babel-loader' 
     }, 
     { 
     test: /\.scss$/, 
     loaders: ['style', 'css', 'sass'] 
     }, 
     { 
      test: /\.(eot|svg|ttf|woff|woff2)$/, 
      loader: 'file?name=fonts/[name].[ext]' 
     }, 
     { 
     test: /\.(png|jpg|gif)$/, 
     loader: "file-loader?name=images/img-[hash:6].[ext]" 
     } 
    ] 
    }, 
    resolve: { 
    extensions: ['', '.js', '.json'] 
    } 
}; 

和：

/* nav.scss */ 

#nav-logo { 
    height: 26px; 
    width: 26px; 
    background-size: 100%; 
    background-image: url('../images/logo-b-green.png'); 
    float: left; 
    margin: 16px 0 0 23px; 
} 

當裝載單一級別路線我的形象鏈接正常工作。

例如在/search圖像鏈接被呈現爲url(images/img-75fa3d.png)並且工作。但是，如果我去一個嵌套路由（通過React路由器），例如， /properties/1圖片鏈接相同，因爲它是相對鏈接：url(images/img-75fa3d.png)，因此無法找到正確的圖片位置。

該示例中的圖像是logo-b-green.png。

編輯：

我加入了publicPath到output部分和它的工作，現在的URL去根。有人可以確認這是處理這個問題的正確方法嗎？

output: { 
path: './public', 
filename: 'bundle.js', 
publicPath: '/' 
}, ... 

Answer 1

我加入了publicPath到output部分和它的工作，現在的URL去根。

output: { 
path: './public', 
filename: 'bundle.js', 
publicPath: '/' 
}, ...