学无先后,达者为师

网站首页 Vue 正文

vue项目中通过webpack定义全局的常量

作者:yunchong_zhao 更新时间: 2022-04-17 Vue

在项目中能不能有这样的变量 不是挂在Vue原型上,就是一个常量在所有的地方都可以访问到 这样的东西
有的童鞋可能说 那个。process.env.NODE_ENV 不就是一个全局的的吗
怎么说呢,这个也算是全局的变量的一种情况吧。

但是我们想要的可能就是。比如 var a = ‘12’ 在项目任何位置都可以访问到这个a

其实是可以做到的。 通过webpack的一个插件来做到
在vue.config.js

import webpack = require('webpack')
module.exports = {
	configureWebpack: {
	    plugins: [
	      new webpack.DefinePlugin({
	        TEST: '"我是个全局的常量"'
	      })
	    ]
  },
}

我们在组建中测试下哈

setup() {
    onMounted(() => {
      // eslint-disable-next-line no-undef
      console.log(TEST, '======全局变量测试');
    })
}

在这里插入图片描述
确实打印出来哈。
细心的童鞋可能发现个 问题哈 我再定义的时候 用单引号包括着 里面的那个字符串
那是因为 当初的环境下。是js运行的环境 比如 我们 定义。TEST: ‘1+1’. 他是会执行。1 + 1 最后打印出来就是 TEST是2,所以定义对象还是定义字符串的时候 要注意这个问题哈

关注我 持续更新 前端知识。

原文链接:https://yunchong.blog.csdn.net/article/details/121000397

栏目分类
最近更新