vue导入静态js_vue 设置配置文件 引入静态js文件

由于一些演示，需要对编码名称等可快速进行修改，需要页面方便配置。由于build后的vue项目基本已经看不出原样，因此需要创建一个文件，并在打包的时候不会进行编译。

vue-cli 2.0的作法是在static文件下创建js。vue-cli 3.0 的写法则是直接在public文件夹下创建js、

具体操作如下：

1、在public文件夹下创建env.js文件，里面文件的语法是es5，不允许使用浏览器不能兼容的es6语法。因为该文件不进行编译，es6部分语法浏览器不兼容。

2.、在html文件下，使用标签进入

3、在页面直接按照原生的方法使用即可。

例如env.js定义了一个变量叫env，并在index.html页面引入后，那么在页面任何一处地方都可以直接使用。

env.js

/自定义全局变量，此文件不编译，因此需要用原生的写法/

let host = "192.168.1.100"

let env = {

host: host,

apiUrl:"http://" + host + "/api/",

msgUrl: "http://10.33.10.33:9000",

wsUrl: "ws://" + host + ":8094"

}

index.html

页面使用：

// 初始 webSocket

initWebSocket() {

if (typeof (WebSocket) == 'undefined') {

this.$notify({

title: '提示',

message: '当前浏览器无法接收实时报警信息，请使用谷歌浏览器！',

type: 'warning',

duration: 0

});

} else {

let socketUrl = env.wsUrl + "/ws/chat/"

this.websock = new WebSocket(socketUrl);

this.websock.onmessage = this.websocketonmessage;

this.websock.onopen = this.websocketonopen;

this.websock.onerror = this.websocketonerror;

this.websock.onclose = this.websocketclose;

}

},