vue iview 组件中img标签无法引用src(生产环境下,django后台)?

clipboard.png
这是配置文件

const path = require('path');
const webpack = require('webpack');
const ExtractTextPlugin = require('extract-text-webpack-plugin');

module.exports = {
entry: {
    main: './src/main',
    vendors: './src/vendors'
},
output: {
    path: path.join(__dirname, './dist')
},
module: {
    rules: [
        {
            test: /\.vue$/,
            use: [
                {
                    loader: 'vue-loader',
                    options: {
                        loaders: {
                            less: ExtractTextPlugin.extract({
                                use: ['css-loader?minimize', 'autoprefixer-loader', 'less-loader'],
                                fallback: 'vue-style-loader'
                            }),
                            css: ExtractTextPlugin.extract({
                                use: ['css-loader', 'autoprefixer-loader', 'less-loader'],
                                fallback: 'vue-style-loader'
                            })
                        }
                    }
                },
                {
                    loader: 'iview-loader',
                    options: {
                        prefix: false
                    }
                }
            ]
        },
        {
            test: /iview\/.*?js$/,
            loader: 'babel-loader'
        },
        {
            test: /\.js$/,
            loader: 'babel-loader',
            exclude: /node_modules/
        },
        {
            test: /\.css$/,
            use: ExtractTextPlugin.extract({
                use: ['css-loader?minimize', 'autoprefixer-loader'],
                fallback: 'style-loader'
            })
        },
        {
            test: /\.less/,
            use: ExtractTextPlugin.extract({
                use: ['css-loader?minimize', 'autoprefixer-loader', 'less-loader'],
                fallback: 'style-loader'
            })
        },
        {
            test: /\.(gif|jpg|png|woff|svg|eot|ttf)\??.*$/,
            loader: 'url-loader?limit=1024&name=image/[name].[hash].[ext]'
        },
        {
            test: /\.(html|tpl)$/,
            loader:'html-loader'                
        }
    ]
},
resolve: {
    extensions: ['.js', '.vue'],
    alias: {
        'vue': 'vue/dist/vue.esm.js',
        'src':  path.resolve(__dirname,'src'),
        'images':path.resolve(__dirname,'src/images')    
    },
}

};

clipboard.png
这是我的目录

现在我使用 webpack-server 是可以正常显示的

clipboard.png

但是我把它们打包到生产环境,就不能正常显示了

clipboard.png

阅读 3.5k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题