Webpack sorties sur le mauvais chemin pour les images
Je suis en train de construire un site avec de réagir et de webpack. Quand j'ai construit une application avec webpack et essayez d'inclure des images, les images sont écrites dans le dossier de la version avec les autres actifs, mais le lien de l'image que webpack sorties est incorrect. Je peux aller dans le dossier de création et d'affichage de l'image, de sorte qu'il est en train d'être copiés correctement, il est le lien qui est faux.
mon réagir composant ressemble à ceci:
JS:
'use strict';
var React = require('react');
var newsFeedIcon = require('../../img/news-feed-icon.png');
//create story component
module.exports = React.createClass({
render: function () {
return (
<div className="col_12 footer-right mobile-foot">
<img src={newsFeedIcon} />
<p><a href="/about">About Us</a> | <a href="/contact">Contact Us</a> | <a href="/faq">FAQ</a> | <a href="/media">Media</a> | <a href="#">Privacy Statement</a> | <a href="#">Terms of Service</a></p>
</div>
);
}
})
Mon Webpack la configuration ressemble à ceci:
JS:
webpack: {
client: {
entry: __dirname + '/app/js/client.jsx',
output: {
path: 'build/',
file: 'bundle.js'
},
module: {
loaders: [
{
test: /\.jsx$/,
loader:'jsx-loader'
},
{
test: /\.css$/,
loader: "style-loader!css-loader"
},
{
test: /\.(eot|woff|woff2|ttf|svg|png|jpg)$/,
loader: 'url-loader?limit=30000&name=[name]-[hash].[ext]'
},
{
test: /\.jpe?g$|\.gif$|\.png$/i,
loader: 'file-loader'
},
{
test: /\.jpg/,
loader: 'file'
}]
}
},
test: {
entry: __dirname + '/test/client/test.js',
output: {
path: 'test/client/',
file: 'bundle.js'
},
module: {
loaders: [
{
test: /\.jsx$/,
loader:'jsx-loader'
}]
}
},
karma_test: {
entry: __dirname + '/test/karma_tests/test_entry.js',
output: {
path: 'test/karma_tests/',
file: 'bundle.js'
},
module: {
loaders: [
{
test: /\.jsx$/,
loader:'jsx-loader'
}]
},
background: true
}
},
J'ai été frapper ma tête contre le mur sur ce depuis hier, de sorte que toute aide serait appréciée. Laissez-moi savoir que vous avez besoin de plus d'infos.
Merci!
Vous devez vous connecter pour publier un commentaire.
Vous pouvez essayer le réglage de la nom option fichier-chargeur, ainsi que
output.publicPath
....
Puis l'résolu url dans votre besoin sera:
/static/bundles/