浏览器访问：localhost:8080,可以查看渲染效果。恩，背景图0.jpg是我爱豆23333。笔芯。注意左上角有红色的abc。
浏览器效果
2.6最后还有一些东西要加在config.js中
最后还要加一些东西
1） historyFallback:{}
因为我们做的是单页应用，所以要加一下地址映射到入口index.html，这个先忽略
2） 热加载功能。
hot功能，可以实现局部渲染：比如你改了一个组件的代码，页面只重新渲染这个组件而不是整个页面进行渲染，不需要进行刷新操作。
3） 一些插件
webpack.HotModuleReplacementPlugin()启动hot功能webpack.NoEmitOnErrorsPlugin()去除一些不必要的信息
4） 浏览器调试代码功能的工具
在浏览器中调试的时候，代码不会转码。
config.devtool = “#cheap-module-evel-source-map”
最后配置完成后，重新npm run dev一次
npm run dev成功之后，可以在浏览器中测试热加载效果，修改app.vue文件中的text的内容，就可以看到左上角那个红色的字在变了emmmm
//app.vue
<template>
<div id="text">{{text}}</div>
</template>
<script>
export default{
data(){
return {
text: 'abc' //打开浏览器，然后直接改这里就可以实时看到文字变化效果了。
}
}
}
</script>
<style>
#test{
color: red;
}
</style>总结
以上所述是小编给大家介绍的Vue+webpack项目基础配置教程，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对软件开发网网站的支持！
