Language-tools: realce de css não utilizado é sempre confuso

Criado em 14 set. 2020  ·  14Comentários  ·  Fonte: sveltejs/language-tools

Descreva o bug
Ao usar blocos de estilo SCSS, as linhas amarelas onduladas CSS não utilizadas não aparecem no lugar certo.

image

Deve destacar a classe .introduction , mas destaca a propriedade height (ou qualquer última propriedade do primeiro estilo definido).

Ao voltar para um bloco CSS normal sem o atributo lang , funciona bem.

Reproduzir

  1. Faça um componente simples com alguns elementos
  2. Adicione alguns CSS baunilha usados ​​e não usados ​​sem funções SCSS ou sintaxe de açúcar
  3. Altere o <style> para <style lang="scss">

Comportamento esperado
Trabalhe da mesma forma como quando é apenas um bloco <style> normal

Capturas de tela
Veja acima

Sistema (preencha as seguintes informações):

  • SO: Windows
  • IDE: VScode
  • Plugin / Pacote: "Svelte para VSCode"

Contexto adicional
Nenhum plug-in ou extensão adicional foi habilitado ao fazer a captura de tela. Até reiniciei o vscode para garantir.

bug

Comentários muito úteis

Isso deve ser corrigido com a versão 4.6.1 de svelte-preprocess .

Todos 14 comentários

Você poderia postar o trecho de código que deu a você os rabiscos nesta linha?

Você poderia postar o trecho de código que deu a você os rabiscos nesta linha?

Não deve importar o código que você usa. Ele rapidamente começa a quebrar na minha extremidade. Quanto mais código, pior fica.

Aqui está um REPL rápido:
https://svelte.dev/repl/97a01882d3444d77ad2a62480e310921?version=3.25.0

No meu IDE, com o atributo SCSS
image

sem o atributo:
image

Obrigado. Preciso verificar se as linhas estão erradas por algum deslocamento, mas, em geral, temo que não possamos fazer muito, já que dependemos dos mapas de origem e se eles estiverem errados / não tão bons, então não há nada que possamos fazer.

Mapas de origem que são gerados durante a transpilação de SCSS para CSS. Precisamos fazer isso antes de passar o código para o compilador Svelte (que dá os avisos não utilizados) porque ele só pode lidar com CSS.

Os mapas de origem são algo que posso corrigir do meu lado? Ou isso é um problema com pré-processamento esbelto? rolar?
Para minha sorte, sei o que css estou escrevendo e html estou removendo, então posso lidar com isso por agora. Existe uma maneira certa de desligá-los caso eu precise?

https://github.com/sveltejs/svelte/pull/5015 precisa ser mesclado para suporte ao mapa de origem do pré-processador

Os mapas de origem são algo que posso corrigir do meu lado? Ou isso é um problema com pré-processamento esbelto? rolar?

O compilador scss ( node-sass / sass , depende do que você está usando) produz os mapas de origem.

Para minha sorte, sei o que css estou escrevendo e html estou removendo, então posso lidar com isso por agora. Existe uma maneira certa de desligá-los caso eu precise?

Se quiser desligar alguns avisos globalmente, você pode fazer isso por meio desta opção .

sveltejs / svelte # 5015 precisa ser mesclado para suporte ao mapa de origem do pré-processador

Não para as ferramentas de linguagem, no momento nós mapeamos nós mesmos (mas podemos jogar fora um monte de código assim que isso chegar).

sveltejs / svelte # 5015 precisa ser mesclado para suporte ao mapa de origem do pré-processador

Parece que é uma solicitação pull relativamente popular. Alguma razão conhecida de por que ainda não foi fundido?

Está no topo do nosso radar. No entanto, ainda não está em um estado fundível. Eu deixei alguns comentários sobre isso.

Eu verifiquei, mas não consegui reproduzir os deslocamentos de linha que você experimentou ao usar apenas SCSS. Você também usa PostCSS? Eu só posso reproduzir se também usar PostCSS. Em caso afirmativo, o motivo para isso são os mapas de origem ausentes do PostCSS. Abri este problema em svelte-preprocess por ele.

Desculpe pela resposta tardia. Tenho https://www.npmjs.com/package/postcss-load-config instalado. É sobre isso.

Isso significa que você está usando postcss, então postcss: true faz parte da configuração do seu pré-processador? Nesse caso, isso será corrigido após o problema em svelte-preprocess ser corrigido.

Isso significa que você está usando postcss, então postcss: true faz parte da configuração do seu pré-processador?

Se postcss for definido como verdadeiro por padrão, sim.

Nesse caso, isso será corrigido depois que o problema no pré-processo svelte for corrigido.

👀

Isso deve ser corrigido com a versão 4.6.1 de svelte-preprocess .

Esta página foi útil?
0 / 5 - 0 avaliações

Questões relacionadas

maximedupre picture maximedupre  ·  5Comentários

matthewmueller picture matthewmueller  ·  3Comentários

canadaduane picture canadaduane  ·  5Comentários

matthewmueller picture matthewmueller  ·  5Comentários

koddr picture koddr  ·  6Comentários