I need to link an image from a "global" path, a path not inside the application served by webpack. I have done something like :
<img src="/users/name/home/Desktop/test.svg"/>
,but I cannot see the image and if a take a look at the img element with inspector I see that the path is this:
http://localhost:8080/users/name/home/Desktop/test.svg
I think the reason is that all this images are served by webpack but I haven't any idea how to change this behaviour. Here my webpack dev configuration file:
const webpack = require('webpack');
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { spawn } = require('child_process');
const redis = require('redis')
// Config directories
const SRC_DIR = path.resolve(__dirname, 'src');
const OUTPUT_DIR = path.resolve(__dirname, 'dist');
// Any directories you will be adding code/files into, need to be added to this array so webpack will pick them up
const defaultInclude = [SRC_DIR];
module.exports = {
entry: SRC_DIR + '/index.js',
output: {
path: OUTPUT_DIR,
publicPath: '/',
filename: 'bundle.js'
},
resolve: {
alias: {
'hiredis': path.join(__dirname, 'aliases/hiredis.js')
}
},
module: {
rules: [
{
test: /\.css$/,
include: /node_modules/,
loaders: ['style-loader', 'css-loader']
},
{
test: /\.css$/,
use: [{ loader: 'style-loader' },
{ loader: 'css-loader' }],
include: defaultInclude
},
{
test: /\.jsx?$/,
use: [{ loader: 'babel-loader' }],
include: defaultInclude
},
{
test: /\.(jpe?g|png|gif)$/,
use: [{ loader: 'file-loader?name=img/[name]__[hash:base64:5].[ext]' }],
include: defaultInclude
},
{
test: /\.(eot|svg|ttf|woff|woff2)$/,
use: [{ loader: 'file-loader?name=font/[name]__[hash:base64:5].[ext]'}],
include: defaultInclude
}
]
},
target: 'electron-renderer',
plugins: [
new HtmlWebpackPlugin(),
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify('development')
})
],
devtool: 'cheap-source-map',
devServer: {
contentBase: OUTPUT_DIR,
stats: {
colors: true,
chunks: false,
children: false
},
setup() {
spawn(
'electron',
['.'],
{ shell: true, env: process.env, stdio: 'inherit' }
)
.on('close', code => process.exit(0))
.on('error', spawnError => console.error(spawnError));
}
}
};
Thanks
Paolo