Eu fiz o deploy de uma aplicação em React em uma hospedagem com Node em um subdomínio (sub.dominio.com.br). Gastei muitas horas para perceber que minha aplicação não consegue ler as variáveis ambiente nem dos arquivos .env nem .env.local. Inclusive tentei cadastrar as variáveis no painel do site, mas sem sucesso também.
Alguém sabe me dizer o que pode estar causando o problema ou já passou por isso e pode me dar uma luz?
Valeu!!
1 curtida
Boa tarde, @fmontone
Primeiramente, seja muito bem-vindo a nossa Comunidade, meu querido! 
Então, teria que ver exatamente qual o erro que está sendo retornado para vermos onde podemos começar a anlaisar. Teve um usuário que teve um erro no momento do deploy também da sua aplicação ReactJS e ele percebeu que não estava enviando o arquivo das as variáveis de ambiente da aplicação dele no momento do deploy, ai localmente ele conseguia executar normalmente a aplicação, mas no momento do deploy retornava o erro 
Porém, você disse que manda o arquivo das variáveis e ele não é lido, certo?
Nesse caso, recomendo verificar se localmente sua aplicação funciona corretamente e ao invés de fazer ali pelo painel do app, tente criar as variáveis que precisa apenas pelo seu arquivo .env e teste novamente o deploy da aplicação juntamente com o arquivo.
Caso não funcione, reitero para passar o log completo do erro aqui, por favor 
Fico a disposição!
Agradeço a resposta, mas já tirei o site da Umbler, postei na Netlify e rodou na hora. Sem erro, tudo está rodando certo.
Eu desconfio que seja um problema com a hospedagem em subdomínio.
A não leitura de um .env não gera logs. Eu conseguia ler minha API apenas se eu utilizasse a URL no js.
Tentei mexer no .env de várias maneiras, tentei subir, tentei mandar sem o gitignore, tentei setar as variáveis através do painel de controle e nada.
Gastei muitas horas tentando, pesquisando formas, alterando, quando não tinha nada errado com a aplicação.
O mais frustrante é subir em outra hospedagem e funcionar sem eu precisar fazer esforço nenhum.
Já mudei o que eu podia, o último só no mês que vem.
@fmontone que pena que não conseguiu resolver seu problema, Fabio
Sentimos muito que não tenhamos atingido suas expectativas, mas agradeço se deixar o seu feddback aqui e algo mais que deseja que melhore em nossa hospedagem, é sempre muito importante sua opinião!
Não temos erros em relação a sub domínios hospedados aqui na nossa infraestrutura. Teria que ver se seus apontamentos estava todos corretos também, fora isso, o erro provavelmente é na programação do seu site e isso pode ser visto ativando os logs dentro da sua conta no painel de controle.
Enfim, caso tenha mais dúvidas, precise de ajuda ou tenha algo mais a acrescentar sinta-se á vontade. Sentimos muito por qualquer contratempo causado.
Seria legal se houvesse uma instrução correta para subdomínios, uma vez que eu fiz os mesmos procedimentos para um site no domínio raiz.
Ótimo que não têm problemas com subdomínios, talvez meu caso seja o primeiro.
Mas como falei, publiquei a mesma coisa no Netlify e funcionou na hora. Sem precisar ver se eu errei nos direcionamentos. Fiz o deploy e pimba! Funcionou na hora. O mesmo código. Pra mim o problema está resolvido!
A quem interessar possa: .env não lido não gera log de erro no console quando você coloca uma URL no axios, por exemplo. A requisição vai assumir a URL raiz do site e por isso vai retornar um Html na sua requisição.
Se for uma outra variável qualquer, vai simplesmente apontar como undefined.
Portanto, se passou pelo mesmo problema, testa em outra hospedagem.
Olá novamente, @fmontone
Obrigado pela seu feedback, é realmente muito importante para nosso trabalho.
Mas realmente, acredito que isso tenha sido um problema isolado seu mesmo, infelizmente
Não temos nenhum problema com hospedagens de subdomínios de maneira nenhuma desde que feito corretamente de acordo com o que especificamos em nossos artigos.
Quanto aos erros de leitura do arquivo .env não lido, o HTML retornado que você referiu acredito que são os nossos logs de erro padrão que utilizamos para guiar o cliente iniciantes em nossos produtos em possíveis problemas que venham a enfrentar.
Temos um relatório exemplificando e explicando cada tipo de erro em hospedagem NodeJS:
Enfim, sinto muito que sua experiência não tenha sido a melhor possível conosco, espero sinceramente que consiga sucesso no seu negócio na sua nova hospedagem e tenha certeza que vamos cada vez mais melhorar nossos serviços e lhe atender e a todos os outros clientes da forma mais humana e efetiva o possível!
Estamos sempre dispostos a ajudar todos 
Abração 
Bom, por incrível que pareça, estou enfrentando o MESMO problema, sem tirar nem por, IGUAL, será mesmo que era um problema isolado do @fmontone ?
Exatamente a mesma coisa comigo, quando é uma variável em React em um domínio, funciona. Porém quando é uma variável em um subdomínio tipo: app.example.com, não funciona. Não adianta tentar de tudo, simplesmente não funciona, no log fica como undefined. Esquece. Não é um caso isolado, a Umbler tem que resolver isso. Acho que é a primeira vez que vocês vêm um usuário reclamando e acham que é o primeiro, por isso pensam que é um caso isolado. Mas acho que os outros usuários tiveram o mesmo problema e só não quiseram contatar o suporte, simplesmente foram pra outra hospedagem. Minha opinião.
Exatamente o mesmo problema com meu subdomínio. Simplesmente ignora minhas variáveis de ambiente setadas pela ferramenta da umbler.
Percebi agora que estou passando pelo mesmo problema no Angular. Minha aplicação também roda num subdomínio, mas o problema é que preciso das variáveis de ambiente definidas durante o deploy para ser possível popular meu ambiente durante o build. Atualmente as variáveis de ambiente definidas pelo painel de controle só são definidas quando o container é iniciado.
Atualmente as viáveis de ambiente definidas durante o deploy são:
HOME='/root'
HOSTNAME='07d019716d07'
INIT_CWD='/usr/src/app'
NG_CLI_ANALYTICS='ci'
NODE='/usr/local/bin/node'
NODE_VERSION='12.19.0'
PATH='/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/usr/src/app/node_modules/.bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin'
PWD='/usr/src/app'
SHLVL='1'
TERM='xterm'
YARN_VERSION='1.22.5'
_='/usr/local/bin/npm'
npm_config_access=''
npm_config_allow_same_version=''
npm_config_also=''
npm_config_always_auth=''
npm_config_argv='{"remain":[],"cooked":["install","--unsafe-perm","--userconfig",".npmrc"],"original":["install","--unsafe-perm","--userconfig",".npmrc"]}'
npm_config_audit='true'
npm_config_audit_level='low'
npm_config_auth_type='legacy'
npm_config_before=''
npm_config_bin_links='true'
npm_config_browser=''
npm_config_ca=''
npm_config_cache='/root/.npm'
npm_config_cache_lock_retries='10'
npm_config_cache_lock_stale='60000'
npm_config_cache_lock_wait='10000'
npm_config_cache_max='Infinity'
npm_config_cache_min='10'
npm_config_cafile=''
npm_config_cert=''
npm_config_cidr=''
npm_config_color='true'
npm_config_commit_hooks='true'
npm_config_depth='Infinity'
npm_config_description='true'
npm_config_dev=''
npm_config_dry_run=''
npm_config_editor='vi'
npm_config_engine_strict=''
npm_config_fetch_retries='2'
npm_config_fetch_retry_factor='10'
npm_config_fetch_retry_maxtimeout='60000'
npm_config_fetch_retry_mintimeout='10000'
npm_config_force=''
npm_config_format_package_lock='true'
npm_config_fund='true'
npm_config_git='git'
npm_config_git_tag_version='true'
npm_config_global=''
npm_config_global_style=''
npm_config_globalconfig='/usr/local/etc/npmrc'
npm_config_globalignorefile='/usr/local/etc/npmignore'
npm_config_group=''
npm_config_ham_it_up=''
npm_config_heading='npm'
npm_config_https_proxy=''
npm_config_if_present=''
npm_config_ignore_prepublish=''
npm_config_ignore_scripts=''
npm_config_init_author_email=''
npm_config_init_author_name=''
npm_config_init_author_url=''
npm_config_init_license='ISC'
npm_config_init_module='/root/.npm-init.js'
npm_config_init_version='1.0.0'
npm_config_json=''
npm_config_key=''
npm_config_legacy_bundling=''
npm_config_link=''
npm_config_local_address=''
npm_config_loglevel='notice'
npm_config_logs_max='10'
npm_config_long=''
npm_config_maxsockets='50'
npm_config_message='%s'
npm_config_metrics_registry='https://registry.npmjs.org/'
npm_config_node_gyp='/usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js'
npm_config_node_options=''
npm_config_node_version='12.19.0'
npm_config_noproxy=''
npm_config_offline=''
npm_config_onload_script=''
npm_config_only=''
npm_config_optional='true'
npm_config_otp=''
npm_config_package_lock='true'
npm_config_package_lock_only=''
npm_config_parseable=''
npm_config_prefer_offline=''
npm_config_prefer_online=''
npm_config_prefix='/usr/local'
npm_config_preid=''
npm_config_production=''
npm_config_progress='true'
npm_config_proxy=''
npm_config_read_only=''
npm_config_rebuild_bundle='true'
npm_config_registry='https://registry.npmjs.org/'
npm_config_rollback='true'
npm_config_save='true'
npm_config_save_bundle=''
npm_config_save_dev=''
npm_config_save_exact=''
npm_config_save_optional=''
npm_config_save_prefix='^'
npm_config_save_prod=''
npm_config_scope=''
npm_config_script_shell=''
npm_config_scripts_prepend_node_path='warn-only'
npm_config_searchexclude=''
npm_config_searchlimit='20'
npm_config_searchopts=''
npm_config_searchstaleness='900'
npm_config_send_metrics=''
npm_config_shell='bash'
npm_config_shrinkwrap='true'
npm_config_sign_git_commit=''
npm_config_sign_git_tag=''
npm_config_sso_poll_frequency='500'
npm_config_sso_type='oauth'
npm_config_strict_ssl='true'
npm_config_tag='latest'
npm_config_tag_version_prefix='v'
npm_config_timing=''
npm_config_tmp='/tmp'
npm_config_umask='0022'
npm_config_unicode=''
npm_config_unsafe_perm='true'
npm_config_update_notifier='true'
npm_config_usage=''
npm_config_user=''
npm_config_user_agent='npm/6.14.8 node/v12.19.0 linux x64'
npm_config_userconfig='/usr/src/app/.npmrc'
npm_config_version=''
npm_config_versions=''
npm_config_viewer='man'
npm_execpath='/usr/local/lib/node_modules/npm/bin/npm-cli.js'
npm_lifecycle_event='postinstall'
npm_lifecycle_script='echo $SHELL; export'
npm_node_execpath='/usr/local/bin/node'
npm_package_bugs_url='https://github.com/nortan-projetos/plataforma.git'
npm_package_description='   '
npm_package_engines_node='12.16.1'
npm_package_engines_npm='6.14.3'
npm_package_homepage='https://github.com/nortan-projetos/plataforma#readme'
npm_package_license='MIT'
npm_package_name='ngx-admin'
npm_package_readmeFilename='README.md'
npm_package_repository_type='git'
npm_package_repository_url='git+https://github.com/nortan-projetos/plataforma.git'
npm_package_scripts_build='ng build --prod --aot'
npm_package_scripts_conventional_changelog='conventional-changelog'
npm_package_scripts_docs='compodoc -p src/tsconfig.app.json -d docs'
npm_package_scripts_docs_serve='compodoc -p src/tsconfig.app.json -d docs -s'
npm_package_scripts_e2e='ng e2e'
npm_package_scripts_lint='eslint '"'"'src/**/*.ts'"'"' '"'"'server.js'"'"' '"'"'backend/app.js'"'"' '"'"'backend/models/*.js'"'"' '"'"'backend/routes/*.js'"'"
npm_package_scripts_lint_ci='npm run lint && npm run lint:styles'
npm_package_scripts_lint_fix='ng lint ngx-admin-demo --fix'
npm_package_scripts_lint_styles='stylelint ./src/**/*.scss'
npm_package_scripts_ng='ng'
npm_package_scripts_postinstall='echo $SHELL; export'
npm_package_scripts_pree2e='webdriver-manager update --standalone false --gecko false'
npm_package_scripts_prepush='npm run lint:ci'
npm_package_scripts_release_changelog='npm run conventional-changelog -- -p angular -i CHANGELOG.md -s'
npm_package_scripts_start='node server.js'
npm_package_scripts_start_dev='nodemon ./server.js'
npm_package_scripts_start_proxy='ng serve --proxy-config proxy-config.json'
npm_package_scripts_test='ng test'
Não tendo nenhuma das variáveis que necessido durante o build. A diferente da Umbler para os outros é que os outros definem durante o deploy e tudo ocorre como o esperado.
@Mario_Alves, como resolvemos esse problema?
Uma solução temporária que deu certo para mim foi me aproveitar que uso um github actions para fazer o deploy e fazer o export das minhas variáveis no script de postinstall assim como eu faço o build da minha aplicação. Aí é só fazer o export das variáveis antes do build pegando elas dos secrets do github. Para isso basta adicionar o https://github.com/marketplace/actions/secret-parser que ele faz o trabalho sujo. Como no fim o git da umbler é privado não há nenhum problema de privacidade.
No fim meu github actions ficou assim : https://github.com/nortan-projetos/plataforma/blob/main/.github/workflows/umbler-deploy.yml
Meu package.json ficou assim: https://github.com/nortan-projetos/plataforma/blob/umbler/package.json (Olhe o diff do último commit do arquivo para ver as alterações)
Para mais detalhes de como usar o github actions com a umbler eu compartilhei um passo a paso aqui.
Qualquer coisa só falar por aqui também.