脚本宝典收集整理的这篇文章主要介绍了vue3-vite 设置环境模式（打包），脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

1.vite.config.js同目录下建立三个文件夹，如下

//生产.env.productionVITE_MODE_NAME=productionVITE_APP_ID=123456VITE_AGENT_ID=123456VITE_LOGIN_TEST=falseVITE_RES_URL=./VITE_APP_TITLE=''VITE_EDITOR=webstorm

//开发.env.developmentVITE_MODE_NAME=developmentVITE_APP_ID=123456VITE_AGENT_ID=123456VITE_LOGIN_TEST=trueVITE_RES_URL=http://192.168.1.87:3000/VITE_APP_TITLE=''VITE_EDITOR=webStorm

//测试环境.env.testVITE_MODE_NAME=testVITE_APP_ID=123456VITE_AGENT_ID=123456VITE_LOGIN_TEST=trueVITE_RES_URL=https://www.baidu.comVITE_APP_TITLE=''VITE_EDITOR=webstorm2. package.json，添加tset,development模式，build默认是生产环境"scripts": {

  "dev": "vite --host",  "build": "vite build",  "test": "vite build --mode test",  "development": "vite build --mode development",  "serve": "vite preview"},3. vite.config.js// 引入 loadEnvimport { defineConfig, loadEnv } from 'vite'

export default defineConfig(({ mode }) => {  const env = loadEnv(mode, __dirname) // loadEnv加载__dirname目录下的 mode文件，若mode为'development',则加载.env.development文件。

  return {    plugins: [      vue(),    ],    base: env.VITE_RES_URL  }})

脚本宝典总结

以上是脚本宝典为你收集整理的vue3-vite 设置环境模式（打包）全部内容，希望文章能够帮你解决vue3-vite 设置环境模式（打包）所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。