Ionicons: os ícones ion mais recentes não funcionam com ionic5 no uiwebview e wkwebview

Também posso confirmar este problema. No meu caso, os ícones aparecem pela primeira vez, mas quando forço fechar o aplicativo Ionic e abrir o aplicativo novamente, eles desaparecem porque o SVG não carrega no Shadow Content, conforme mostrado na captura de tela de @rashmendis

O mesmo para mim
Em 15 de junho de 2020, 17h45 +0530, himanshuarya [email protected] , escreveu:

Também posso confirmar este problema. No meu caso, os ícones aparecem pela primeira vez, mas quando forço fechar o aplicativo Ionic e abrir o aplicativo novamente, eles desaparecem porque o SVG não carrega no Shadow Content, conforme mostrado na captura de tela de @rashmendis
—
Você está recebendo isso porque foi mencionado.
Responda a este e-mail diretamente, visualize-o no GitHub ou cancele a inscrição.

Outra observação é que, mesmo usando um SVG personalizado, o SVG não carrega pela segunda vez ao forçar o fechamento do aplicativo.

sim. O mesmo para mim
Em 15 de junho de 2020, 18h21 +0530, himanshuarya [email protected] , escreveu:

Outra observação é que, mesmo usando um SVG personalizado, o SVG não carrega pela segunda vez ao forçar o fechamento do aplicativo.
—
Você está recebendo isso porque foi mencionado.
Responda a este e-mail diretamente, visualize-o no GitHub ou cancele a inscrição.

Mesmos problemas para mim

Mesmo aqui. Não apenas com UIWebview, também com WKWebview.

@rashmendis como você usou o antigo ionicon:4.6.3? Você desinstalou o 5.xe instalou o 4.x?

Tentei isso, mas como o ionicon é uma dependência do ionic, ele instalará o ionicon5 com o ionic 5. Então eu tive que fazer o downgrade do ionic para o ionic4
Em 19 de julho de 2020, 10h45 +0530, jdpsbh [email protected] , escreveu:

@rashmendis como você usou o antigo ionicon:4.6.3? Você desinstalou o 5.xe instalou o 4.x?
—
Você está recebendo isso porque foi mencionado.
Responda a este e-mail diretamente, visualize-o no GitHub ou cancele a inscrição.

@brandyscarney alguém da equipe Ionic está investigando algum dos problemas de ícones de íons? Parece que nenhum dos problemas de ícone de íon não foi atribuído, triado ou investigado. Este problema é um dos principais problemas no Ion-icon v5 que vem junto com o Ionic 5. Este é um problema de bloqueio que está nos impedindo de atualizar do Ionic 4 para o Ionic 5. Você pode resolver esse problema?

Ei @himanshuarya , nós ouvimos você. Você pode compartilhar mais informações sobre o problema que está vendo (amostra de código, capturas de tela)?

@rashmendis Você poderia compartilhar o código do aplicativo iônico de amostra no qual conseguiu reproduzir esse problema?
@bensperry - @rashmendis compartilhou uma captura de tela do DOM onde não há conteúdo na div icon-inner no Shadow Content. Por favor, consulte essa captura de tela no primeiro comentário.

@bensperry Basta fazer um ionic start myApp tabs e criar um aplicativo com ion-icons. Em seguida, é necessário criar o aplicativo e executá-lo dentro de um uiwebview ou wkwebview no iPad ou em um dispositivo Apple.

Ei @rashmendis , isso é frustrante. Não podemos reproduzir o problema do nosso lado.

Basicamente, precisamos de mais informações. O que você está usando para implantar o aplicativo - você está usando Capacitor ou Cordova? Por favor, compartilhe as etapas exatas para seguirmos e seja o mais específico possível. Isso nos ajudará muito a descobrir exatamente o que pode estar dando errado mais rapidamente.

@bensperry Não usando capacitor ou Cordova. O que você precisa fazer é criar um aplicativo de guia usando ionic start myApp tabs . Então você precisa construir o aplicativo usando ionic build --prod . Então você precisa criar um aplicativo iOS com um UIWebView ou WKWebView e carregar o aplicativo iônico que construímos anteriormente. O aplicativo está funcionando diretamente no aplicativo iPad Safari sem problemas, mas não funciona dentro do UIWebView ou WKWebView. Eu estava testando dentro de um aplicativo iOS comercial, então não poderei compartilhar o código. Mas, como você pode ver nos comentários, é um problema comum quando executamos o aplicativo ionic5 dentro de um iOS WebView.

Obrigado pelo problema. Portanto, apenas usar WKWebView ou UIWebView não será suficiente para carregar os Ionicons. A razão é que quando um ícone SVG é carregado, ele é tratado como um arquivo local, e WKWebView tem algumas limitações ao referenciar arquivos locais por si só.

A melhor solução aqui é usar um pequeno servidor local para servir os arquivos. A maneira mais fácil de fazer isso é usar Capacitor . Você pode ver nosso Guia de introdução para integrar rapidamente o Capacitor em seu aplicativo existente.

Você pode testar seu aplicativo com o Capacitor e me informar se ele resolve o problema?

Eu estava enfrentando o mesmo problema. meu problema foi resolvido alterando o caminho no arquivo angular.json
Caminho antigo:
....
"bens": [
{
"globo": " / ","input": "src/assets","saída": "ativos"},{"glob": " /.svg",
"input": "node_modules/ionicons/dist/ionicons/svg",
"saída": "./svg"
}
],
....

novo caminho:
....
"bens": [
{
"globo": " / ","input": "src/assets","saída": "ativos"},{"glob": " /.svg",
"input": "node_modules/ionicons/dist/svg",
"saída": "./svg"
}
],
....