vue process的疑惑

process官方给出的解释是：process 对象是一个全局变量，它提供有关当前 Node.js 进程的信息并对其进行控制。 作为一个全局变量，它始终可供 Node.js 应用程序使用，无需使用 require()。

最近项目中有一个需求就是展示图片，但图片服务器时另外一个，也就是说我展示图片的时候我要拼上另外一个服务器的地址。

这个时候肯定想到在dev.js中配置图片服务器地址，和其他一样

module.exports = {
    NODE_ENV: "'development'",
    ENV_CONFIG: "dev",
    BASE_API: "'http://192.168.0.6:8765'",
    IMAGE_API: "http://192.168.0.6:8082"
};

这个时候使用，却用不了

console.log(process.env. IMAGE_API);

报错如下：

image.png

看了很多资料都无法理解为什么报这个错
然后我尝试打印process.env

console.log(process.env);

报错包的更看不懂了
Vue warn]: Error in data(): "ReferenceError: dev is not defined"

image.png

我再尝试打印process
可以打印的，但是env时空的

image.png

又开始各种百度啊，google啊，无解
然后我突然想起来，页面的请求时正常的，但是请求用到了process.env.BASE_API
我又尝试打印BASE_API，发现竟然可以

image.png

这个时候我就郁闷了，我就开始一个字一个字的对配置文件
发现IMAGE_API和ENV_CONFIG都少了一个单引号
加上

module.exports = {
    NODE_ENV: "'development'",
    ENV_CONFIG: "'dev'",
    BASE_API: "'http://192.168.0.6:8765'",
    IMAGE_API: "'http://192.168.0.6:8082'"
};

尝试打印

console.log(process);
console.log(process.env);
console.log(process.env.IMAGE_API);

很完美

image.png

但是有一个疑惑就是为什么process下的env仍然是空的

image.png

直接打印process.env是有值的，这个很奇怪，我还没有找到原因。找到原因再来补充吧