1、在vue下默认都是在根目录下，
我们的请求地址一般是这样的
http://127.0.0.1:8080/
但是我们部署到服务器后，地址可能是这样的
http://127.0.0.1/earth/
2、我们在vue下会引用static中的静态资源，这里简单示例一个image和一个json
我们的代码如下
<template>
<div id="main">
文字内容
<div id="test"></div>
<div id="test2">
</div>
</div>
</template>
<script type="text/javascript">
export default{
name:'Main',//模板名称
data(){
return {
viewer:null,
}
},
components:{
},
mounted(){
var image = new Image();
image.src = "./static/cities.json";
},
methods:{
}
}
#main,#CesiumViewer{
height: 100%;
width: 100%;
padding: 0;
margin: 0;
overflow: hidden;
background-color: #ccc;
}
#test{
background: url(../../static/m.jpg) center;
width: 300px;
height: 300px;
}
#test2{
background: url(/static/1.jpg) center;
width: 300px;
height: 300px;
}
3、这种情况下图片和json都是可以获取到的（json用image来替代）
3、router index.js配置
4、再看关于webpack的配置
需要修改两处，config /index.js
采用相对路径
再修改build/utils.js
修改publicPath
5、之后可以npm run build，然后将dist下的文件拷入nginx/html/eart路径下
可以看到图片显示
只显示了一张图片
只显示了一张，问题就是关于路径的配置
上面的配置是对的
网友评论