39
respostas

Sprite não compilado (me deem uma luz)

Meu sprite não compilou no sublime mas sigo fazendo o projeto.

https://github.com/amandagodoy/Sass-Compas-descompilando-CSS

Poderiam me ajudar a descobrir o que tenho feito de errado. Já é a terceira vez que faço esse projeto e imagino que não seja uma boa prática, ficar refazendo todo o projeto desde o inicio principalmente pelo tempo mais o trabalho de achar o problema no final.

39 respostas

Fala ai Amanda, tudo bem? Acabei de responder uma dúvida que pode te ajudar: https://cursos.alura.com.br/forum/topico-consegui-mas-nao-como-queria-137936

Espero ter ajudado.

Matheus, bem e vc como está?

Bom fiz os procedimentos que me guiou bastante e um uninstall do compass, mas mesmo assim continua tendo o mesmo erro, segue abaixo o erro:

Error: No files were found in the load path matching "plataformas/*.png". Your current load paths are: C:/Users/mandi/OneDrive/Documentos/Meus Projetos/Front-end/Sass-Compas-descompilando-CSS/site-apeperia/imagens on line 2 of C:/Users/mandi/OneDrive/Documentos/Meus Projetos/Front-end/Sass-Compas-descompilando-CSS/site-apeperia/css/estilos.scss

1: //$sprite-space: 5px; 2: @import "plataformas/*.png"; 3: 4: @import 'helpers/variaveis'; 5: @import 'helpers/mixins'; 6: 7: @import 'base/normalize';

Backtrace: C:/Users/mandi/OneDrive/Documentos/Meus Projetos/Front-end/Sass-Compas-descompilando-CSS/site-apeperia/css/estilos.scss:2 C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/import_node.rb:67:in rescue in import' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/import_node.rb:44:inimport' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/import_node.rb:28:in imported_file' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/import_node.rb:37:incss_import?' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/visitors/perform.rb:314:in visit_import' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/visitors/base.rb:36:invisit' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/visitors/perform.rb:162:in block in visit' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/stack.rb:79:inblock in with_base' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/stack.rb:115:in with_frame' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/stack.rb:79:inwith_base' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/visitors/perform.rb:162:in visit' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/visitors/base.rb:52:inblock in visit_children' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/visitors/base.rb:52:in map' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/visitors/base.rb:52:invisit_children' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/visitors/perform.rb:171:in block in visit_children' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/visitors/perform.rb:183:inwith_environment' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/visitors/perform.rb:170:in visit_children' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/visitors/base.rb:36:inblock in visit' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/visitors/perform.rb:190:in visit_root' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/visitors/base.rb:36:invisit' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/visitors/perform.rb:161:in visit' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/visitors/perform.rb:10:invisit' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/root_node.rb:36:in css_tree' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/tree/root_node.rb:20:inrender' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/engine.rb:284:in render' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/compass-import-once-1.0.5/lib/compass/import-once/engine.rb:17:inblock in render' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/compass-import-once-1.0.5/lib/compass/import-once/engine.rb:29:in with_import_scope' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/compass-import-once-1.0.5/lib/compass/import-once/engine.rb:16:inrender' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/plugin/compiler.rb:494:in update_stylesheet' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/plugin/compiler.rb:215:inblock in update_stylesheets' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/plugin/compiler.rb:209:in each' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/plugin/compiler.rb:209:inupdate_stylesheets' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/sass-3.4.25/lib/sass/plugin/compiler.rb:294:in watch' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/compass-1.0.3/lib/compass/sass_compiler.rb:46:inwatch!' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/compass-1.0.3/lib/compass/commands/watch_project.rb:41:in perform' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/compass-1.0.3/lib/compass/commands/base.rb:18:inexecute' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/compass-1.0.3/lib/compass/commands/project_base.rb:19:in execute' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/compass-1.0.3/lib/compass/exec/sub_command_ui.rb:43:inperform!' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/compass-1.0.3/lib/compass/exec/sub_command_ui.rb:15:in run!' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/compass-1.0.3/bin/compass:30:inblock in <top (required)>' C:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/compass-1.0.3/bin/compass:44:in `<top

isso está no terminal:

error css/estilos.scss (Line 2: No files were found in the load path matching "plataformas/*.png". Your current load paths are: C:/Users/.../OneDrive/Documentos/Meus Projetos/Front-end/Sass-Compas-descompilando-CSS/site-apeperia/imagens)

Fala Amanda, por algum motivo o SASS e Compass não estão achando a pasta plataformas com os arquivos .png dentro.

Verifique o caminho do arquivo .scss e estrutura de pasta das imagens, garante que existe essa pasta plataformas com as imagens dentro.

Espero ter ajudado.

Bom conforme a solução que tu me passou eu tentei aplicar, mas não entendi o diretório aonde ficaria a pasta plataforma seria criada para ser importado.

Fala Amanda, você acabou criando a pasta plataforma dentro de imagens em singular, quando deveria ser no plural.

Após arrumar o nome da pasta o CSS vai dar outros erros de mixin, faça:

  1. Vai no seu plano.scss e troca o sprite de @include all-sprite-sprites; para @include all-plataformas-sprites; isso porque o nome do meio é referente ao nome da pasta onde encontra-se os sprites.

Espero ter ajudado.

Matheus, ainda continua tendo o mesmo problema e já commitei as atualizações.

Fala Amanda, eu fiz o teste com seu projeto, apaguei os arquivos .css e rodei um compass compile, deu tudo certo.

O arquivo estilos.css foi criado com sucesso sem erro algum.

Abraços.

Matheus, agradeço por me ajudar com todos esses erros.

Mas detalhando sua explicação para o projeto do sass e compass dar certo, você excluiu quais arquivos .css para ele compilar em compass?

Fala Amanda, exclui todos kkkk

Ai ele compilou o estilos.css corretamente, os outros ele vai tentar compilar também por ser o padrão do SASS, mas, o importante para você é o estilos.css.

Para ele não compilar tudo, os arquivos devem começar com _, exemplo:

planos.scss =>_planos.scss

Assim o SASS não compila arquivos que começam com _, o resto no código não muda nada (imports e afins).

Espero ter ajudado.

Pois nos meus arquivos todos são .scss tem .css, certo? Então eu excluo todos para rodar o compilador do compass isso?

Eu só estou confirmando, pq está mais difícil do que imaginava finalizar esse modulo kkkk

Fiz a compilação e veio isso no console:

C:\Users\mandi\OneDrive\Documentos\Meus Projetos\Front-end\Sass-Compas-descompilando-CSS\site-apeperia>compass compile write css/base/normalize.css create imagens/plataformas-se0d250c14a.png error css/estilos.scss (C:/Ruby27-x64/lib/ruby/2.7.0/tempfile.rb:129:in initialize': No such file or directory @ rb_sysopen - C:/Users/mandi/OneDrive/Documentos/Meus Projetos/Front-end/Sass-Compas-descompilando-CSS/site-apeperia/.sass-cache/75fcaf1b4852ceb732871195e41567cc2a7d8997/C%058/Ruby27-x64/lib/ruby/gems/2.7.0/gems/compass-core-1.0.3/stylesheets/compass/_support.scssc20210107-1304-sae9wn) error css/helpers/mixins.scss (C:/Ruby27-x64/lib/ruby/2.7.0/tempfile.rb:129:ininitialize': No such file or directory @ rb_sysopen - C:/Users/mandi/OneDrive/Documentos/Meus Projetos/Front-end/Sass-Compas-descompilando-CSS/site-apeperia/.sass-cache/75fcaf1b4852ceb732871195e41567cc2a7d8997/C%058/Ruby27-x64/lib/ruby/gems/2.7.0/gems/compass-core-1.0.3/stylesheets/compass/_support.scssc20210107-1304-yzt8o2) write css/helpers/variaveis.css error css/layout/blog.scss (Line 26: Undefined variable: "$mq-mobile".) error css/layout/contato.scss (Line 11: Undefined variable: "$mq-mobile".) error css/layout/destaque.scss (Line 10: Undefined variable: "$mq-mobile".) error css/layout/footer.scss (Line 21: Undefined variable: "$cor-auxiliar".) error css/layout/geral.scss (Line 10: Undefined variable: "$mq-mobile".) error css/layout/header.scss (Line 3: Undefined variable: "$cor-padrao".) error css/layout/planos.scss (Line 3: Undefined variable: "$cor-auxiliar".) error css/layout/sobre.scss (Line 30: Undefined mixin 'all-plataformas-sprites'.) Compilation failed in 10 files.

Fala Amanda, parece que ainda não está encontrando alguns arquivos, depois das alterações o projeto no Github foi atualizado? Vou precisar rodá-lo novamente e analisar com mais calma.

Espero ter ajudado.

Olá Mahtues, obrigada pela sua insistência em me ajudar em sass. Sim, já atualizei no github

Fala Amanda, testei aqui novamente, tenta o seguinte:

  1. Apague a pasta .sass-cache e os arquivos estilos.css e estilos.map.css.
  2. Tente compilar o arquivo novamente: compass compile css/estilos.scss (na raiz do site-apeperia.

Espero ter ajudado.

Também tive vários problemas com o sass/compass , uso o visual studio code (windows 10)

e parece que o problema está nos programas, estou seguindo meu curso sem fazer esse procedimentos...

Anderson, eu tentei seguir as aulas contento os erros no sublime e vscode, mas ainda estou travada nesse erro independente de seguir as aulas do curso

Sim, infelizmente não consegui corrigir esse erro, terminei o curso! Acho que o problema está na versão do programa Sass/Compass .

Finalizei o curso sem usar o recurso e fazendo apenas as anotações, e futuramente tentarei usar em algum outro programa!

Espero que você consiga resolver e finalizar o curso também Amanda!

Anderson, obrigada e sucesso para ti

Matheus, então nos meus arquivos tem duas pastas do mesmo nome, qual seria o caminho?

site-apeperia/.sass-cache

site-apeperia/css/.sass-cache

Fala Amanda, pode apagar as duas.

Abraços.

apresentou tal erro:

C:\Users\mandi\OneDrive\Documentos\Meus Projetos\Front-end\Sass-Compas-descompilando-CSS\site-apeperia>sass compile css/estilos.scss Error reading compile: no such file or directory.

C:\Users\mandi\OneDrive\Documentos\Meus Projetos\Front-end\Sass-Compas-descompilando-CSS\site-apeperia>sass css/estilos.scss Error: Can't find stylesheet to import. ╷ 2 │ @import 'plataformas/*.png'; │ ^^^^^^^^^^^^^^^^^^^ ╵ css\estilos.scss 2:9 root stylesheet

o erro anterior foi no terminal pelo sublime, já o erro abaixo foi da vscode:

PS C:\Users\mandi\OneDrive\Documentos\Meus Projetos\Front-end\Sass-Compas-descompilando-CSS\site-apeperia> sass compile css/estilos.scss sass : O arquivo C:\Users\mandi\AppData\Roaming\npm\sass.ps1 não pode ser carregado porque a execução de scripts foi desabilitada neste sistema. Para obter mais informações, consulte about_Execution_Policies em https://go.microsoft.com/fwlink/?LinkID=135170. No linha:1 caractere:1

  • sass compile css/estilos.scss
  • ~
    • CategoryInfo : ErrodeSegurança: (:) [], PSSecurityException
    • FullyQualifiedErrorId : UnauthorizedAccess

Fala Amanda, tenta executar o comando pelo CMD por favor e me mande o log completo.

Fico no aguardo.

Matheus, boa noite!

Segue abaixo:

C:\Users\mandi\OneDrive\Documentos\Meus Projetos\Front-end\Sass-Compas-descompilando-CSS\site-apeperia>sass compile css/estilos.scss Error reading compile: no such file or directory.

Fala ai Amanda, acho que você usou o sass em vez do compass (eu tinha mandado o comando errado).

Tente: sass compile css/estilos.scs.

Fico no aguardo.

Matheus,

Está me deixando confusa é sass ou compass?

C:\Users\mandi\OneDrive\Documentos\Meus Projetos\Front-end\Sass-Compas-descompilando-CSS\site-apeperia>sass compile css/estilos.scss Error reading compile: no such file or directory.

C:\Users\mandi\OneDrive\Documentos\Meus Projetos\Front-end\Sass-Compas-descompilando-CSS\site-apeperia>compass compile css/estilos.scss 'compass' não é reconhecido como um comando interno ou externo, um programa operável ou um arquivo em lotes.

Fala Amanda, estranho, o compass não está sendo reconhecido via CMD.

Se você tentar rodar algum comando do SASS, ele é reconhecido? Tente pegar a versão do SASS por exemplo: sass -v

Talvez vai ser necessário adicionar os binários do Ruby no PATH da máquina (depende de como foi feita a instalação do SASS).

Espero ter ajudado.

Oi Matheus eu fiz a instalação via terminal do vscode

Fala Amanda, você instalou via npm?

Abraços

Eu instalei conforme instruções da alura: Instalando Com o Ruby instalado, dê o comando abaixo e aguarde o término da instalação.

gem install sass

Fala Amanda, reparei que tu instalei o SASS via Ruby com gem.

Eu recomendo você instalar via npm:

npm i -g sass

Via NPM normalmente os binários do SASS são adicionados no PATH da máquina e podem ser chamados globalmente.

Espero ter ajudado.

Olá Matheus, Então fiz a instalação e agora?

Fala Amanda, agora tenta rodar o SASS via CMD e posteriormente o Compass.

Abraços.

Olá Matheus,

Quais os comandos devo usar para ambos

Fala Amanda, no caso seria rodar o sass para ver se está funcionando via CMD agora (após instalar via npm) e o compass da forma como é feita em aula.

Espero ter ajudado.

Usar esses comando abaixo: sass compile css/estilos.scss & compass compass compile css/estilos.scss

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software