vconsole使用方法 vue_VUE移动端项目配置vConsole控制台功能

功能效果图如下：

vConsole插件的npm地址：https://www.npmjs.com/package/vconsole

开发环境，因在浏览器，所以不需要vConsole；

生产环境，给用户看的，不能有vConsole；

测试环境，因H5页面是移动端使用的，所以需要vConsole。

因此要在Vue项目里配置不同的环境。

1、在项目根目录下，新建3个环境配置文件

.env.development

.env.mtest

.env.production

2、文件里可以配置需要根据环境切换的任意变量

(1)自定义变量名以“VUE_APP_”开头：development=>开发；mtest=>测试；production=>生产

(2)配置环境名的变量名是“NODE_ENV”

3、修改src下的main.js文件

将：

new Vue({

render: h => h(App),

router

}).$mount('#app')

修改为：

const template=