Webpack4 packaging error

webpack.conf.js

const path = require("path");  
const webpack = require("webpack");
const HtmlWebpackPlugin = require("html-webpack-plugin"); 
const uglify = require("uglifyjs-webpack-plugin"); 
module.exports={  
    //  
    entry:{  
        a:"./src/index.js",  
        b:"./src/index2.js"  
    },  
    //  
    output:{  
        path:path.resolve(__dirname,"dist"),//path  
        filename:"[name].bundle.js",
        publicPath: "/"
    },  
    module: {
        rules:[
           {
                test:/\.css$/,
                use:["style-loader","css-loader"],
                include:path.join(__dirname,"./src"),
                exclude:/node_modules/
           },{
                test: /\.(png|jpg|gif|svg|bmp|eot|woff|woff2|ttf)$/,
                loader: {
                    loader: "url-loader",
                    options: {
                        limit: 5 * 1024,//  > limit file-loader, url-loader
                        outputPath: "images/"// 
                    }
                }
            }   
        ]
    },
    plugins:[  
        new webpack.HotModuleReplacementPlugin(),
        new HtmlWebpackPlugin({  
            chunks:["a"],  
            filename:"index.html",//index.html  
            template:"./src/index.html"  
        }),  
        // new uglify() 
    ],
    devServer:{  
        contentBase:path.resolve(__dirname,"dist"),  
        host:"localhost",  
        port:8090,  
        open:true,
        compress: true // gzip
 
    } 
};  

. / src/index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <link rel="stylesheet" type="text/css" href="./css/index.css">
</head>
<body>
  <div id="app"></div>
  <h1>wejiweji</h1>
  <div id="tupian"></div>
</body>
</html>

browser error

index.css
-sharptupian{
    background-image: url(../imagess/a.png);
    width:466px;
    height:453px;
 }

ask for the boss"s answer

Mar.02,2021

  1. refused to apply style, has been rejected; it should be a problem that static resources cannot be used;
  2. using Express to host static files

your index.html doesn't even introduce js. Naturally, css cannot be loaded.

Menu