无法在Vue Cli中加载背景图片

时间:2018-08-27 07:58:14

标签: webpack vuejs2 vue-cli

我已将css文件与webpack和文件加载器合并。结果,我已经拥有所需的所有文件,但无法从css文件加载图像文件。如果您有解决方案,请提供帮助。 我的webpack.config文件

const ExtractTextPlugin = require("extract-text-webpack-plugin");
module.exports = {
    entry: './src/assets/css/common.css',
    output: {
        path: __dirname + "/static/assets/css",
        filename: "index.js"
    },
    module: {
        rules: [
            {
                test: /\.css$/,
                use: ExtractTextPlugin.extract({
                    fallback: "style-loader",
                    use: "css-loader"
                })
            },
            {
                test: /\.(png|woff|woff2|eot|ttf|svg|jpg)$/,
                use: [
                    {
                        loader: 'file-loader',
                        options: {
                            limit: 100000,
                            name: '[name].[ext]',
                            useRelativePath: true,
                        },
                    }
                ]
            }
        ]
    },
    plugins: [
        new ExtractTextPlugin('common.css')
    ]
}

This is image result

And add to index.html

And result in browser

0 个答案:

没有答案