uniapp distingue configuração de embalagem de ambiente

visão geral

Ao desenvolver a web, às vezes um conjunto de códigos precisa ser compilado e publicado em sites diferentes, como o site principal e o site WeChat h5. (Observe que não é um conjunto de código que se adapta a diferentes navegadores internamente, mas na verdade separa e implementa diferentes sites.)
Ao desenvolver pequenos programas, muitas vezes há plataformas estendidas de pequenos programas, como pequenos programas DingTalk e pequenos programas Taobao baseados em Ali pequenos programas. .
O uni-app pode implementar uma plataforma de compilação condicional personalizada package.jsonadicionando nós de extensão no arquivo .uni-app

Após a expansão da nova plataforma, são 3 impactos:

• Você pode escrever compilação condicional personalizada no código, escrevendo código especial para esta nova plataforma
• Compilar e executar para novas plataformas pode ser executado em tempo de execução
• A compilação e distribuição para novas plataformas podem ser realizadas no momento do lançamento

Perceber

Ele só pode expandir as plataformas da web e de applets, mas não o empacotamento de aplicativos. E ao estender a plataforma do Mini Programa, apenas a subplataforma pode ser estendida com base na plataforma de referência especificada, e a plataforma de referência não pode ser estendida. As plataformas de referência são detalhadas abaixo.

uso de configuração estendida package.json:

Se não package.json, crie-o por comando npm init -y.
Exclua package.jsona configuração de inicialização; copie diretamente o código abaixo

Atributos

• UNI_PLATFORM suporta apenas o preenchimento das plataformas de referência suportadas por uni-app por padrão. Atualmente, está limitado aos seguintes valores de enumeração:h5、mp-weixin、mp-alipay、mp-baidu、mp-toutiao、mp-qq
• BROWSER está atualmente limitado apenas UNI_PLATFORM为h5时有效,aos seguintes valores de enumeração:chrome、firefox、id、edge、safari、hbuilderx
• variável de ambiente env
• title O título do ambiente personalizado, que pode ser exibido no menu de execução do HBuliderX
• definir compilação condicional personalizada; constantes de compilação condicional personalizada, recomenda-se que sejam maiúsculas
• UNI_BASE_URL caminho de solicitação global personalizado

{
    
    
	"uni-app": {
    
    
		"scripts": {
    
    
			"dev-h5": {
    
    
				"title": "开发版H5",
				"BROWSER": "chrome",
				"env": {
    
    
					"UNI_PLATFORM": "h5",
					"UNI_BASE_URL": "/host"
				},
				"define": {
    
    
					"DEV-H5": true
				}
			},
			"pre-h5": {
    
    
				"title": "测试版H5",
				"BROWSER": "chrome",
				"env": {
    
    
					"UNI_PLATFORM": "h5",
					"UNI_BASE_URL": "https://test.XXX.XXX.com"
				},
				"define": {
    
    
					"PRE-H5": true
				}
			},
			"prod-h5": {
    
    
				"title": "正式版H5",
				"BROWSER": "chrome",
				"env": {
    
    
					"UNI_PLATFORM": "h5",
					"UNI_BASE_URL": "https://XXX.XXX.com"
				},
				"define": {
    
    
					"PROD-H5": true
				}
			},
			"devwx": {
    
    
				"title": "开发版微信小程序",
				"env": {
    
    
					"UNI_PLATFORM": "mp-weixin",
					"UNI_BASE_URL": "https://test.XXX.XXX.com"
				}
			},
			"prewx": {
    
    
				"title": "测试版微信小程序",
				"env": {
    
    
					"UNI_PLATFORM": "mp-weixin",
					"UNI_BASE_URL": "https://test.XXX.XXX.com"
				}
			},
			"prodwx": {
    
    
				"title": "正式版微信小程序",
				"env": {
    
    
					"UNI_PLATFORM": "mp-weixin",
					"UNI_BASE_URL": "https://XXX.XXX.com"
				}
			}
		}
	}
}

//新建文件 config.js
module.exports = {
    
    
	baseUrl: process.env.UNI_BASE_URL,
}

correr

implantação de pacote

Perceber

• Comentários não são permitidos no arquivo package.json, caso contrário a configuração da extensão será inválida. Exclua os comentários, caso contrário ocorrerá um erro de compilação.
• vue-cli precisa ser atualizado para a versão mais recente, HBuilderX precisa ser atualizado para a versão 2.1.6+
• É inválido modificar diretamente o valor do BASE_URLcampo

demonstração de erro

configuração do pacote.json do site oficial do uniapp