----------------------------------webpack.config.js-------------------------------------------------------
const config = {
entry: {
main: './src/index.js',
sub: './src/index.js',
},
output: {
publicPath:"http://www.baidu.com", //当文件的静态资源在另外一个链接上的时候，可以通过设置publicPath来同一设置路径 效果如index.html
filename: '[name].js', //生成文件名称相互对应
path: path.resolve(__dirname,'dist') //打包出来的文件放入dist目录下
},
plugins:[new HtmlWebpackPlugin({ //将打包出来的文件放入src/index.html文件中
template:'src/index.html'
}),new CleanWebpackPlugin(['dist'])],
module: {
rules: [
{
test: /.jpg$/, //这个配置是重点
use: {
loader:"file-loader",
options:{
name:'[name].[ext]', //打包出来的图片名字和后缀都和之前的一样，
outputPath:"images/" //打包出来的文件存放在dist/images文件夹中
}
}
},
]
}
};
-----------------------------index.html----------------------------------------
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script type="text/javascript" src="http://www.baidu.com/main.js"></script>
<script type="text/javascript" src="http://www.baidu.com/sub.js"></script>
</body>
</html>