vue公共URL 定义方法(六)
这里写自定义目录标题定义公共变量正确的方式原因解释定义公共变量vue3.0中,放在public文件夹下文件并不一定会不被打包。如果在main.js中直接引用,肯定会被webpack打包。如下写法在打包后,及时更改了url.js中的url地址,更改后的地址还是无效的。1、目录结构:2、url.js内容export const httpUrl="http://10.88.44.142:80...
·
定义公共变量
vue3.0中,放在public文件夹下文件并不一定会不被打包。如果在main.js中直接引用,肯定会被webpack打包。如下写法在打包后,及时更改了url.js中的url地址,更改后的地址还是无效的。
1、目录结构:
2、url.js内容
export const httpUrl="http://10.88.44.142:8080";
3、main.js内容
import {httpUrl} from '../public/url';
Vue.prototype.httpUrl=httpUrl;
4、在文件中的使用
var socket = new SockJS(this.httpUrl + "/ws");
正确的方式
1、url.js
window.globalConfig = {
"apiUri": "http://10.88.44.142:8080"
}
2、config.js
import Vue from 'vue'
const API_BASE_URI = window.globalConfig.apiUri
Vue.prototype.$httpUrl = API_BASE_URI
var config = {
API_BASE_URI: API_BASE_URI
}
export default config
3、main.js
import config from './config'
4、index.html
<script src="./url.js" type="text/javascript"></script>
5、在文件中使用
var socket = new SockJS(this.$httpUrl + "/ws");
原因解释
main.js中引用的文件肯定会被webpack打包,所以直接引用url.js,会将url.js打包。
需要在config.js中引用url.js中定义的全局变量,然后将config.js打包。因为config中的变量不是固定的,所以打包进webpack还是可以通过更改url来更改config。
这样的话,可以打包后更改调用的后台地址,而不用重新打包。
更多推荐
已为社区贡献3条内容
所有评论(0)