BrowserSync é uma ótima ferramenta para injetar automaticamente novos css no seu navegador cada vez que ele é modificado.
Se você ainda não usou o Grunt, confira o Guia de primeiros passos.
O que é Browsersync?
O Browsersync torna seu fluxo de trabalho de teste de navegador mais rápido, sincronizando URLs, interações e alterações de código em vários dispositivos. É muito rápido e .
É bem simples de usar. Em primeiro lugar, inicie o “grunt watch” em uma janela do terminal.
grunt watch
Em seguida, abra uma segunda janela de terminal e instale a sincronização do navegador, se você ainda não tiver:
npm install grunt-contrib-watch --save-dev
Em seguida, mude para o diretório css em pub / static, por exemplo:
cd pub/static/frontend/MyTheme/default/en_GB/css
Agora, inicie a sincronização do navegador com o seguinte (ajuste o URL do proxy para a instalação da sua loja)
browser-sync start --proxy 'dev.www.mystore.com' --files="*.css"
Isso iniciará a abertura de uma guia do navegador para: http: // localhost: 3000, que carregará sua loja.
Agora, à medida que você faz alterações em seus arquivos LESS, o comando grunt watch re-compila o CSS, que por sua vez aciona a sincronização do navegador para injetar o novo css.
Tudo sem você ter que levantar um dedo.
Observação: se você estiver usando o docker, atualmente eu executo a sincronização do navegador fora da janela de encaixe e o grunhido é executado internamente. Isso funciona muito bem.
Segurança: Atualizações frequentes geralmente incluem patches de segurança para corrigir vulnerabilidades identificadas. Ao manter o Magento atualizado, você reduz significativamente…
Como adicionar uma mensagem de Alerta ou Aviso do Admin do Magento 2 Injete o Magento\Framework\Message\ManagerInterface no construtor da sua…
Para exibir as mensagens adicionadas na classe Magento\Framework\Message\ManagerInterface em um arquivo .phtml, você pode usar o seguinte código: <?php $objectManager…
Para criar um script no Magento 2 que exporte as categorias para um arquivo XML com o nome da categoria,…
Para definir um vídeo MP4 como plano de fundo em um <div> usando HTML e CSS, você pode seguir estas…
Como desativar o "lastname" no Magento 2 e Adobe Commerce Desativando a obrigatoriedade do campo Execute a SQL abaixo diretamente…