No VS <= 2015, podemos usar a extensão WebEssentials que se encarrega de compilar os arquivos less / sass para nós, mas atualmente não oferece suporte ao VS 2017. Você está ciente de uma extensão semelhante que pode compilar o less / sass na construção?
Como compilar arquivos less / sass no Visual Studio 2017
Respostas:
WebEssentials está sendo dividido em várias extensões. Acredito que a funcionalidade que você deseja agora está na extensão do Web Compiler .
Se você quiser fazer isso sem extensões, você pode usar um executor de tarefas como o Gulp. Veja aqui um passo a passo de como integrar as tarefas Gulp ao VS.
Estou usando o Web Compiler como uma extensão no VS 2019 para ajudar a compilar alguns arquivos .less muito antigos e ainda está funcionando muito bem.
—
klewis
NOTA: O Web Compiler foi abandonado, a última atualização foi há 5 anos. Tem alguns problemas não corrigidos, mas meio que funciona.
—
Alex,
O Web Compiler funcionou para mim no VS 2019, mas ele não recompila automaticamente .less fora da caixa. Você deve executar a compilação uma vez manualmente (veja esta resposta ) para que o arquivo compilerconfig.json seja criado. Depois disso, ele irá recompilar automaticamente os arquivos .less.
—
neizan
ATUALIZAÇÃO - LEIA ESTA PÁGINA, COMO ADICIONEI UMA RESPOSTA ADICIONAL (ESTA JÁ NÃO PARECE FUNCIONAR PARA MIM).
Para aqueles, como eu, que não conhecem Gulp ou Grunt ou Shriek ou Wail e não querem, você PODE fazer o Visual Studio 2017 compilar seus arquivos SCSS automaticamente, assim como costumava fazer no Visual Studio 2015. as etapas abaixo funcionaram para mim.
Primeiro desinstale quaisquer extensões / pacotes Nuget antigos para o Web Compiler (não sei se isso é necessário ou não).
Vá para a página de download da galeria VSIX e escolha fazer o download do Web Compiler.
Observe que fiz isso primeiro escolhendo Ferramentas / Extensões e Atualizações no Visual Studio. Embora parecesse funcionar, descobri que meus arquivos SCSS parciais não estavam sendo compilados automaticamente para CSS quando fiz as alterações (não fui o único ).
Agora você deve conseguir clicar com o botão direito do mouse no arquivo SCSS mestre e escolher as opções mostradas abaixo, que devem criar automaticamente um arquivo chamado compilerconfig.json na raiz do seu projeto (esta etapa provavelmente é desnecessária se você já tiver esse arquivo) :
Desse ponto em diante, tudo parecia funcionar bem. Ufa! A propósito, graças a Mads Kristensen por esta extensão - qualquer coisa para evitar aprender algo novo ...
Eu não entendo esse comentário! Não tenho certeza de qual é a resposta aceita, mas nenhuma delas é semelhante à que dei.
—
Andy Brown
A resposta aceita é aquela com a marca verde. Atualmente ele tem o maior número de votos positivos e sugere o uso da mesma extensão do Web Compiler. De qualquer forma gostei da sua resposta por causa das fotos.
—
Mihail Shishkov
Obrigado. Minha resposta fornece uma solução sem usar Gulp / Grunt e também fornece os detalhes extras de que as pessoas precisarão. Olhei para a resposta marcada (entre outras), mas não resolveu meu problema sem as informações extras acima - por isso me esforcei para postar, apenas para evitar que outras pessoas desperdiçassem o mesmo tempo que eu gastei tentando resolver isso .
—
Andy Brown
tente ler a resposta aceita, está dizendo a mesma coisa, mas também sugere como usar o Gulp
—
Keith Nicholas
OK, vejo agora que a resposta aceita diz a mesma coisa - a minha apenas adiciona mais detalhes. Espero que leitores preguiçosos como eu possam achar isso útil!
—
Andy Brown,
Resposta simples:
- para compilar arquivos LESS e SASS: Web Compiler ou Web Essentials 2017 (inclui muitas extensões)
- para compilar apenas arquivos SASS (SCss): CompileSass
- para compilar apenas arquivos LESS : LESS Compiler
Minha resposta anterior funcionou para mim por alguns meses, mas agora não funciona mais. Quando tento compilar, recebo uma mensagem na janela Erros sobre problemas com o esquema CompilerConfig e não consigo resolver isso (nem pesquisar no Google nem instalar / desinstalar ajudou).
Portanto, uma resposta alternativa é usar CompileSASS , que é um add-in muito mais simples, com (muito) menos documentação online, mas que funciona perfeitamente. As únicas desvantagens que vejo são:
- o CSS gerado está na mesma pasta do SCSS, então tive que mudar algumas coisas em meu site para acomodar isso; e
- o CSS gerado é reduzido apenas, pelo que posso ver
Depois de instalar o add-in (estou usando o VS 2017), você pode ir em Ferramentas> Opções para alterar as configurações:
Espero que agora eu possa retomar o trabalho! A propósito, obrigado a todos os autores de suplementos - não quero reclamar.
Ainda bem que rolei todo o caminho desta vez. Eu estava prestes a seguir seu anterior. responda. Talvez você deva atualizá-lo com uma nota, se você acha que a resposta não funciona mais. :)
—
radbyx
Funcionou como um encanto. Muito obrigado.
—
radbyx
Se você já tem o Web Compiler e está enfrentando os mesmos erros descritos nesta postagem, veja minhas postagens aqui: stackoverflow.com/a/55290276/3609362 github.com/madskristensen/WebCompiler/issues/…
—
Matt G
Acabei de baixar o Web Compiler para Visual Studio 2019 e até agora está funcionando perfeitamente. Há algum problema específico do Visual Studio 2017?
—
Andy Brown
Agora também existe um compilador menos específico. https://github.com/madskristensen/LessCompiler
Eu baixei e instalei a extensão. Em seguida, abri meu arquivo Site.less e posso ver onde está a marca d'água para ajustar no compilador. Em seguida, fiz uma construção em meu site e também o abri no modo de depuração. Quando abro meu Site.css, que está sob o Site.less, ele tem a marca d'água gerada. Em seguida, tento pesquisar uma propriedade recém-adicionada, mas ela não está lá e não estou obtendo meu CSS. Alguma ideia de como posso fazer com que ele construa o meu LESS?
—
Caverman