webpack项目中使用图片引入的问题记录

前不久才学的webpack配置，图片处理配置如下：

 {
                test:/\.(jpg|jpeg|png|gif)$/,
                use:[
                    {
                        loader:"url-loader",
                        options:{
                            name:"[name]-[hash:5].min.[ext]",
                            limit:500,
                        }
                    }
                ]
}

然后就以为项目中使用图片都会这么处理（很菜的行为，大神勿喷），后来自己测试时在入口文件中app.js添加

var img=new Image();
img.src="./assets/images/test.png"
document.body.appendChild(img)

打包访问页面发现图片路径不对，打包dist中也没有对应文件；
几经百度才发现这问题其实都不算时问题，提问的很少，作为菜鸟的我只是在这记录下，希望有朝一日我变大神后能回头看来一笑而过；
最后总结的是：直接在模板文件中img.src这种行为其实就是静态引入文件没有经过webpack处理难道还想出结果？可笑
正确的方法是：import img from ''./assets/images/test.png"或者在css文件中定义（当然你的webpack有处理css-loader等）