最常见的企业建站程序有,线下推广是什么意思,开发app的公司挣钱吗,企业网站推广形式有在vue2#xff0c;用的vue-cli脚手架搭建项目#xff0c;cli用的是webpack
当你yarn dev时#xff0c;命令会启动package.json中的dev键名的值#xff0c;也就是后面的一行命令
这时浏览器会去识别你是开发环境还是生产环境#xff0c;其实windows是不能直接识别你是开发…在vue2用的vue-cli脚手架搭建项目cli用的是webpack
当你yarn dev时命令会启动package.json中的dev键名的值也就是后面的一行命令
这时浏览器会去识别你是开发环境还是生产环境其实windows是不能直接识别你是开发环境还是生产环境的是webpack帮助我们识别了开发环境和生产环境。在vue2中我们可以直接用process.env就能拿到环境变量。这是webpack的功劳。
在vue3中用的是vite,不是webpack当你yarn dev时启动开发环境window是无法识别你是开发环境还是生产环境的这时vite用内部的dotenv这个第3方库来帮助识别是开发环境还是生产环境当你yarn dev市dotenv会判断你启动的是开发环境还是生产环境如果是开发环境就去项目的根目录中找.env.development环境变量文件将这个文件中创建的变量也就是所有以VITE_开头的环境变量添加到import.meta.env中
import.meta.env是window浏览器提供的。
import.meta.env中不仅有你自己创建的VITE_开头的环境变量还有一开始就系统就创建好的环境变量。 注意
NODE_MODE是node.js提供的系统变量
webpack4之前都是在package.json的scripts中手动指定环境变量
webpack4之后都是在webpack.config.js中新增加了mode选项通过这个mode选项来指定环境变量
总结
vite通过dotenv识别开发环境和生产环境在识别环境后在根文件中找到对应的.env环境变量文件将文件中的以VITE_开头的变量全部添加到import.meta.env对象中。
