nuxt打包更改目录

在项目开发时，常常会有多个环境且每个环境接口皆不一样，大型项目尤其如此，本地环境一套，测试环境一套，生产环境一套，如此便有3套接口，在切换一台服务器的时候要换一次接口，打包一次，操作未免过于繁琐，能不能简便点呢？
于是有了一下解决方案： 在打包的时候一次打包3套，在上传服务器的时候让每个服务器解析属于自己的那套

约定打包文件地址：

环境	打包地址
生产环境	dist/prod
测试环境	dist/qa
本地环境	dist/dev

既然一次要打三个包，那肯定要配置3个打包命令,在nuxt项目中，打包命令默认为 npm run generate,我们来改造下

打包命令

package.json文件中：

"scripts": {
    "generate": "cross-env SITE_ENV=dev nuxt generate",		//打包本地环境
    "generate-qa ": "cross-env SITE_ENV=qa nuxt generate",		// 打包测试环境
    "generate-prod": "cross-env SITE_ENV=prod nuxt generate",	// 打包生产环境

指定打包文件目录

nuxt.config.js文件中：

module.exports = {
	·  · ·
 generate: {
    dir: process.env.SITE_ENV === 'prod' ? 'dist/prod' : (process.env.SITE_ENV === 'qa' ? 'dist/qa' : 'dist/dev')
  }
}

不同环境的接口域名：

以axios为例：
nuxt.config.js文件中：

module.exports = {
	·  · ·
	axios: {
  	 · · ·
   		 baseURL: process.env.SITE_ENV === 'prod' ? 'http://prod.xxx.xxx(生产环境接口域名)' : (process.env.SITE_ENV === 'qa' ? 'http://qa.xxx.xxx(测试环境接口域名)' : 'http://qa.xxx.xxx(本地环境接口域名)')
 	}
}

nuxt 官方配置说明：
https://zh.nuxtjs.org/api/configuration-generate