webpack alias解析后的路径错误

刺目34148
  • 12

下面是我的webpack配置文件,在scss里面引入一个背景图片

background: url('~imgs/background.jpg') no-repeat;

图片放在src/images/background.jpg。

但是路径解析成 css/images/background.jpg 前面多了一个css。
我在js里面import 'imgs/background.jpg'最后解析的路径是对的,只有在scss里路径多了一层css

entry: {
    index: path.resolve(__dirname, '../src/index.js')
},
output: {
    filename: 'js/[name].[hash:8].js',
    path: path.resolve(__dirname, '../dist')
},
resolve: {
    extensions: ['.js', '.jsx', '.tsx', '.ts'],
    alias: {
        'imgs': path.resolve(__dirname, '../src/images')
    }
},
module: {
    rules: [
        {
            test: /\.jsx?$/,
            use: 'babel-loader',
            exclude: /node_modules/
        },
        {
            test: /\.tsx?$/,
            use: 'ts-loader'
        },
        {
            test: /\.css$/,
            use: [
                MiniCssExtractPlugin.loader,
                'css-loader',
                'postcss-loader',
            ]
        },
        {
            test: /\.(scss|sass)$/,
            use: [
                MiniCssExtractPlugin.loader,
                'css-loader',
                'postcss-loader',
                'sass-loader'
            ]
        },
        {
            test: /\.(png|jpg|jpeg|gif)$/,
            use: {
                loader: 'url-loader',
                options: {
                    name: '[name].[ext]',
                    outputPath: 'images/',
                    limit: 8192 //8kb
                }
            }
        },
        {
            test: /\.(eot|ttf|svg|woff|woff2)$/,
            use: {
                loader: 'file-loader',
                options: {
                    name: '[name].[ext]',
                    outputPath: 'font/'
                }
            }
        }
    ]
},
plugins: [
    new MiniCssExtractPlugin({
        filename: 'css/[name].[hash:8].css',
        chunkFilename: 'css/[id].[hash:8].css',
    })
]
回复
阅读 1.3k
1 个回答
new MiniCssExtractPlugin({
    filename: 'css/[name].[hash:8].css'
})

这段代码的问题 去掉css/就可以了

你知道吗?

宣传栏