nó atrevido
v9.0.0
Aviso: Node Sass atingiu o fim de sua vida útil. Não receberá mais lançamentos, nem mesmo para correções de segurança. Projetos que ainda o utilizam devem passar para o Dart Sass.
As versões suportadas do Node.js variam de acordo com o lançamento, consulte a página de lançamentos.
Versões do nó que atingirem o fim da vida útil https://github.com/nodejs/Release serão retiradas do suporte a cada lançamento do node-sass (principal, secundário).
Pararemos de construir binários para versões não suportadas, de testar quebras na compatibilidade de dependências, mas não bloquearemos instalações para aqueles que desejam oferecer suporte a si mesmos.
A nova versão do nó requer pequenas alterações internas junto com suporte de provedores de CI (AppVeyor, GitHub Actions). Abriremos um único fascículo para os interessados assinarem e fecharemos fascículos adicionais.
Abaixo está um guia rápido para versões mínimas e máximas suportadas do node-sass:
| NodeJS | Versão suportada do node-sass | Módulo de nó |
|---|---|---|
| Nó 20 | 9,0+ | 115 |
| Nó 19 | 8,0+ | 111 |
| Nó 18 | 8,0+ | 108 |
| Nó 17 | 7,0+, <8,0 | 102 |
| Nó 16 | 6,0+ | 93 |
| Nó 15 | 5,0+, <7,0 | 88 |
| Nó 14 | 4,14+, <9,0 | 83 |
| Nó 13 | 4,13+, <5,0 | 79 |
| Nó 12 | 4,12+, <8,0 | 72 |
| Nó 11 | 4,10+, <5,0 | 67 |
| Nó 10 | 4,9+, <6,0 | 64 |
| Nó 8 | 4,5,3+, <5,0 | 57 |
| Nó <8 | <5,0 | <57 |
Ele permite que você compile nativamente arquivos .scss para css em uma velocidade incrível e automaticamente por meio de um middleware de conexão.
Encontre-o no npm: https://www.npmjs.com/package/node-sass
Siga @nodesass no Twitter para atualizações de lançamento: https://twitter.com/nodesass
npm instala node-sass
Alguns usuários relataram problemas de instalação no Ubuntu devido ao node ser registrado em outro pacote. Siga a documentação oficial do NodeJS para instalar o NodeJS para que #!/usr/bin/env node seja resolvido corretamente.
A compilação em máquinas Windows requer os pré-requisitos node-gyp.
Você está vendo o seguinte erro? Confira nosso guia de solução de problemas.**
SyntaxError: Use of const in strict mode.
Está tendo problemas de instalação? Confira nosso guia de solução de problemas.
npm install -g mirror-config-china --registry=https://registry.npmmirror.com npm instala node-sass
var sass = require('node-sass');sass.render({
arquivo: scss_filename,
[, opções..]}, function(err, result) { /*...*/ });// ORvar resultado = sass.renderSync({
dados: scss_content
[, opções..]}); Tipo: String
Padrão: null
Especial : file ou data devem ser especificados
Caminho para um arquivo para o LibSass compilar.
Tipo: String
Padrão: null
Especial : file ou data devem ser especificados
Uma string a ser passada ao LibSass para compilar. É recomendado que você use includePaths em conjunto com isso para que o LibSass possa encontrar arquivos ao usar a diretiva @import .
Este é um recurso experimental do LibSass. Use com cuidado.
Tipo: Function | Function[] function(url, prev, done)
Padrão: undefined
Parâmetros e informações da função:
url (String) - o caminho em import as-is , que o LibSass encontrou
prev (String) - o caminho resolvido anteriormente
done (Function) - uma função de retorno de chamada para invocar na conclusão assíncrona, usa um objeto literal contendo
file (String) - um caminho alternativo para o LibSass usar OR
contents (String) - o conteúdo importado (por exemplo, lido da memória ou do sistema de arquivos)
Manipula quando o LibSass encontra a diretiva @import . Um importador personalizado permite a extensão do mecanismo LibSass de maneira síncrona e assíncrona. Em ambos os casos, o objetivo é return ou chamar done() com um objeto literal. Dependendo do valor do literal do objeto, uma de duas coisas acontecerá.
Ao retornar ou chamar done() com { file: "String" } , o novo caminho do arquivo será assumido para @import . É recomendável estar atento ao valor de prev nos casos em que a resolução relativa do caminho pode ser necessária.
Ao retornar ou chamar done() com { contents: "String" } , o valor da string será usado como se o arquivo tivesse sido lido por meio de uma fonte externa.
A partir da v3.0.0:
this se refere a um escopo contextual para a execução imediata de sass.render ou sass.renderSync
os importadores podem retornar um erro e o LibSass emitirá esse erro em resposta. Por exemplo:
done(new Error('não existe!'));// ou return synchronouslyreturn new Error('nada para fazer aqui'); importador pode ser um array de funções, que serão chamadas pelo LibSass na ordem de ocorrência no array. Isso ajuda o usuário a especificar um importador especial para um tipo específico de caminho (sistema de arquivos, http). Se um importador não quiser manipular um caminho específico, ele deverá retornar null . Veja a seção de funções para mais detalhes sobre os tipos Sass.
Este é um recurso experimental do LibSass. Use com cuidado.
functions é um Object que contém uma coleção de funções personalizadas que podem ser invocadas pelos arquivos sass que estão sendo compilados. Eles podem receber zero ou mais parâmetros de entrada e devem retornar um valor de forma síncrona ( return ...; ) ou assíncrona ( done(); ). Esses parâmetros serão instâncias de um dos construtores contidos no hash require('node-sass').types . O valor de retorno também deve ser de um desses tipos. Veja abaixo a lista de tipos disponíveis:
getValue() / setValue(value) : obtém/define a parte numérica do número
getUnit() / setUnit(unit) : obtém/define a parte da unidade do número
getValue() / setValue(value) : obtém/define a string incluída
getR() / setR(value) : componente vermelho (número inteiro de 0 a 255 )
getG() / setG(value) : componente verde (número inteiro de 0 a 255 )
getB() / setB(value) : componente azul (número inteiro de 0 a 255 )
getA() / setA(value) : componente alfa (número de 0 a 1.0 )
Exemplo:
var Cor = require('node-sass').types.Color,
c1 = nova cor (255, 0, 0),
c2 = nova cor(0xff0088cc); getValue() : obtém o booleano incluído
types.Boolean.TRUE : instância singleton de types.Boolean que contém "true"
types.Boolean.FALSE : instância singleton de types.Boolean que contém "false"
getValue(index) / setValue(index, value) : o próprio value deve ser uma instância de um dos construtores em sass.types .
getSeparator() / setSeparator(isComma) : se deve usar vírgulas como separador
getLength()
getKey(index) / setKey(index, value)
getValue(index) / setValue(index, value)
getLength()
types.Null.NULL : instância singleton de types.Null .
sass.renderSync({
dados: '#{títulos(2,5)} { cor: #08c; }',
funções: {'títulos ($ de: 0, $ para: 6)': função (de, para) { var i, f = from.getValue(), t = to.getValue(), lista = new sass.types .Lista(t - f + 1); para (i = f; i <= t; i++) {list.setValue(i - f, new sass.types.String('h' + i)); } lista de retorno;}
}}); Tipo: Array
Padrão: []
Uma série de caminhos que o LibSass pode procurar para tentar resolver suas declarações @import . Ao usar data , é recomendado que você use isso.
Tipo: Boolean
Padrão: false
valores true habilitam a sintaxe recuada Sass para analisar a sequência de dados ou arquivo.
Nota: node-sass/libsass irá compilar uma biblioteca mista de arquivos scss e de sintaxe recuada (.sass) com a configuração Padrão (false), desde que as extensões .sass e .scss sejam usadas nos nomes de arquivos.
Tipo: String
Padrão: space
Usado para determinar se deve ser usado espaço ou caractere de tabulação para recuo.
Tipo: Number
Padrão: 2
Máximo: 10
Usado para determinar o número de espaços ou tabulações a serem usados para recuo.
Tipo: String
Padrão: lf
Usado para determinar se deve usar a sequência cr , crlf , lf ou lfcr para quebra de linha.
Tipo: Boolean
Padrão: false
Especial: ao usar isto, você também deve especificar outFile para evitar comportamento inesperado.
valores true desabilitam a inclusão de informações do mapa de origem no arquivo de saída.
Tipo: String | null
Padrão: null
Especial: obrigatório quando sourceMap é um valor verdadeiro
Especifique o local pretendido do arquivo de saída. Fortemente recomendado ao gerar mapas de origem para que eles possam fazer referência adequada aos arquivos pretendidos.
Atenção ao ativar esta opção não irá gravar o arquivo no disco para você, é apenas para referência interna (para gerar o mapa, por exemplo).
Exemplo de como gravá-lo no disco
sass.render({...outFile: seuPathTotheFile,
}, function(error, result) { // retorno de chamada no estilo de nó a partir da v3.0.0if(!error){ // Sem erros durante a compilação, escreva este resultado no disco fs.writeFile(yourPathTotheFile, result.css, function (err){if(!err){ //arquivo gravado no disco} });}
});}); Tipo: String
Padrão: nested
Valores: nested , expanded , compact , compressed
Determina o formato de saída do estilo CSS final.
Tipo: Integer
Padrão: 5
Usado para determinar quantos dígitos após o decimal serão permitidos. Por exemplo, se você tivesse um número decimal de 1.23456789 e uma precisão de 5 , o resultado será 1.23457 no CSS final.
Tipo: Boolean
Padrão: false
true Permite que o número da linha e o arquivo onde um seletor está definido sejam emitidos no CSS compilado como um comentário. Útil para depuração, especialmente ao usar importações e mixins.
Tipo: Boolean | String | undefined
Padrão: undefined
Permite a geração do mapa de origem durante render e renderSync .
Quando sourceMap === true , o valor de outFile é usado como o local de saída de destino para o mapa de origem com o sufixo .map anexado. Se nenhum outFile for definido, o parâmetro sourceMap será ignorado.
Quando typeof sourceMap === "string" , o valor de sourceMap será usado como local de gravação do arquivo.
Tipo: Boolean
Padrão: false
true inclui o contents das informações do mapa de origem
Tipo: Boolean
Padrão: false
true incorpora o mapa de origem como um URI de dados
Tipo: String
Padrão: undefined
o valor será emitido como sourceRoot nas informações do mapa de origem
render retorno de chamada (>= v3.0.0) node-sass suporta retornos de chamada assíncronos de estilo de nó padrão com a assinatura de function(err, result) . Em condições de erro, o argumento error é preenchido com o objeto de erro. Em condições de sucesso, o objeto result é preenchido com um objeto que descreve o resultado da chamada de renderização.
message (String) - A mensagem de erro.
line (Number) - O número da linha do erro.
column (Número) - O número da coluna de erro.
status (Número) - O código de status.
file (String) - O nome do arquivo do erro. Caso a opção file não tenha sido definida (em favor de data ), isso refletirá o valor stdin .
css (Buffer) - O CSS compilado. Escreva isso em um arquivo ou distribua conforme necessário.
map (Buffer) - O mapa de origem
stats (Object) - Um objeto contendo informações sobre a compilação. Ele contém as seguintes chaves:
entry (String) - O caminho para o arquivo scss ou data se a fonte não for um arquivo
start (Number) - Date.now() antes da compilação
end (Number) - Date.now() após a compilação
duration (Número) - fim - início
includedFiles (Array) - Caminhos absolutos para todos os arquivos scss relacionados sem nenhuma ordem específica.
var sass = require('node-sass');sass.render({
arquivo: '/caminho/para/meuArquivo.scss',
dados: 'corpo{fundo:azul; a{cor:preto;}}',
importador: function(url, prev, done) {// url é o caminho na importação como está, que o LibSass encontrou. // prev é o caminho resolvido anteriormente. // done é um retorno de chamada opcional, consuma-o ou retorne o valor de forma síncrona .// this.options contém este hash de opções, this.callback contém o estilo de nó callbacksomeAsyncFunction(url, prev, function(result){ done({file: result.path, // apenas um deles é necessário, consulte a seção Comportamentos Especiais.contents: result.data });});// ORvar result = someSyncFunction(url, prev);return {file: result.path, content: result.data};
},
includePaths: [ 'lib/', 'mod/' ],
outputStyle: 'compressed'}, function(error, result) { // retorno de chamada no estilo do nó da v3.0.0 em diante
if (erro) {console.log(error.status); // costumava ser "código" na v2x e abaixoconsole.log(error.column);console.log(error.message);console.log(error.line);
}
else {console.log(result.css.toString());console.log(result.stats);console.log(result.map.toString());// ou bestconsole.log(JSON.stringify(result. mapa)); // nota, JSON.stringify também aceita Buffer
}});// ORvar resultado = sass.renderSync({
arquivo: '/caminho/para/arquivo.scss',
dados: 'corpo{fundo:azul; a{cor:preto;}}',
estilo de saída: 'compactado',
outFile: '/to/my/output.css',
sourceMap: true, // ou um caminho absoluto ou relativo (para outFile)
importador: function(url, prev, done) {// url é o caminho na importação como está, que o LibSass encontrou. // prev é o caminho resolvido anteriormente. // done é um retorno de chamada opcional, consuma-o ou retorne o valor de forma síncrona .// this.options contém estas opções hashsomeAsyncFunction(url, prev, function(result){ done({file: result.path, // apenas uma delas é necessária, consulte a seção Special Behaviours.contents: result.data }) ;});// ORvar resultado = someSyncFunction(url, prev);return {arquivo: resultado.caminho, conteúdo: resultado.dados};
}});console.log(resultado.css);console.log(resultado.map);console.log(resultado.stats); Caso as opções file e data estejam definidas, node-sass dará precedência aos data e usará file para calcular caminhos nos mapas de origem.
As informações da versão node-sass e libsass agora são expostas por meio do método info :
var sass = require('node-sass');console.log(sass.info);/* irá gerar algo como: node-sass 2.0.1 (Wrapper) [JavaScript] libsass 3.1.0 (Sass Compiler) [ C/C++]*/Como node-sass >=v3.0.0 a versão do LibSass é determinada em tempo de execução.
Lista de usos comunitários de node-sass em ferramentas e estruturas de construção.
@jasonsanjose criou uma extensão Brackets baseada em node-sass: https://github.com/jasonsanjose/brackets-sass. Ao editar arquivos Sass, a extensão compila as alterações ao salvar. A extensão também se integra ao Live Preview para mostrar as alterações do Sass no navegador sem salvar ou compilar.
O plugin sass oficial do Brunch usa node-sass por padrão e volta automaticamente para Ruby se o uso do Compass for detectado: https://github.com/brunch/sass-brunch
Recompile arquivos .scss automaticamente para servidores http baseados em conexão e expressão.
Esta funcionalidade foi movida para node-sass-middleware em node-sass v1.0.0
@10xLaCroixDrinker escreveu um plugin DocPad que compila arquivos .scss usando node-sass: https://github.com/docpad/docpad-plugin-nodesass
@stephenway criou uma extensão que transpila Sass para CSS usando node-sass com duo.js https://github.com/duojs/sass
@sindresorhus criou um conjunto de tarefas pesadas baseadas em node-sass: https://github.com/sindresorhus/grunt-sass
@dlmanning criou um plugin gulp sass baseado em node-sass: https://github.com/dlmanning/gulp-sass
O servidor web Harp do @sintaxi compila implicitamente arquivos .scss usando node-sass: https://github.com/sintaxi/harp
@stevenschobert criou um plugin metalsmith baseado em node-sass: https://github.com/stevenschobert/metalsmith-sass
@fourseven criou um plugin de meteoro baseado em node-sass: https://github.com/fourseven/meteor-scss
@dbashford criou um módulo Mimosa para sass que inclui node-sass: https://github.com/dbashford/mimosa-sass
Há também um exemplo de aplicativo de conexão aqui: https://github.com/andrew/node-sass-example
O Node-sass inclui binários pré-compilados para plataformas populares. Para adicionar um binário à sua plataforma, siga estas etapas:
Confira o projeto:
git clone --recursivo https://github.com/sass/node-sass.gitcd node-sass instalação npm node scripts/build -f # use -d switch para liberação de depuração# se for bem-sucedido, ele gerará e moverá# o binário no diretório do fornecedor.
A interface para uso da linha de comando é bastante simplista neste estágio, como visto na seção de uso a seguir.
A saída será enviada para stdout se o sinalizador --output for omitido.
node-sass [options] [output] Ou: cat | node-sass > output
Exemplo:
node-sass src/style.scss dest/style.css
Opções:
-w, --watch Monitora um diretório ou arquivo
-r, --recursive Monitora recursivamente diretórios ou arquivos
-o, --output Diretório de saída
-x, --omit-source-map-url Omitir comentário do URL do mapa de origem da saída
-i, --indented-syntax Trata dados de stdin como código sass (versus scss)
-q, --quiet Suprime a saída do log, exceto em caso de erro
-v, --version Imprime informações da versão
--output-style Estilo de saída CSS (aninhado | expandido | compacto | compactado)
--indent-type Tipo de recuo para CSS de saída (espaço | tab)
--indent-width Largura do recuo; número de espaços ou tabulações (valor máximo: 10)
--linefeed Estilo de avanço de linha (cr | crlf | lf | lfcr)
--source-comments Inclui informações de depuração na saída
--source-map Emite mapa de origem
--source-map-contents Incorporar conteúdo incluído no mapa
--source-map-embed Incorporar sourceMappingUrl como URI de dados
--source-map-root Caminho base, será emitido no mapa de origem como está
--include-path Caminho para procurar arquivos importados
--follow Segue diretórios com links simbólicos
--precision A quantidade de precisão permitida em números decimais
--error-bell Produz um caractere de sino em caso de erros
--importer Caminho para o arquivo .js que contém o importador personalizado
--functions Caminho para o arquivo .js contendo funções personalizadas
--help Imprimir informações de uso A input pode ser um único .scss ou .sass ou um diretório. Se a entrada for um diretório, o sinalizador --output também deverá ser fornecido.
Além disso, observe que --importer leva o caminho (absoluto ou relativo ao pwd) para um arquivo js, que precisa ter um module.exports padrão definido para a função de importador. Veja nossos equipamentos de teste, por exemplo.
A opção --source-map aceita um valor booleano e, nesse caso, substitui a extensão de destino por .css.map . Ele também aceita o caminho para o arquivo .map e até mesmo o caminho para o diretório desejado. Ao compilar um diretório --source-map pode ser um valor booleano ou um diretório.
node-sass suporta diferentes parâmetros de configuração para alterar configurações relacionadas ao binário sass, como nome binário, caminho binário ou caminho de download alternativo. Os seguintes parâmetros são suportados pelo node-sass:
| Nome da variável | Parâmetro .npmrc | Argumento do processo | Valor |
|---|---|---|---|
| SASS_BINARY_NAME | sass_binary_name | --sass-nome-binário | caminho |
| SASS_BINARY_SITE | sass_binary_site | --sass-binário-site | URL |
| SASS_BINARY_PATH | sass_binary_path | --sass-binário-caminho | caminho |
| SASS_BINARY_DIR | sass_binary_dir | --sass-binário-dir | caminho |
| SASS_REJECT_UNAUTHORIZED | sass_reject_unauthorized | --sass-rejeitar-não autorizado | valor |
Esses parâmetros podem ser usados como variável de ambiente:
Por exemplo, export SASS_BINARY_SITE=http://example.com/
Como arquivo de configuração .npmrc local ou global:
Por exemplo, sass_binary_site=http://example.com/
Como argumento de processo:
Por exemplo, npm install node-sass --sass-binary-site=http://example.com/
Se você estiver usando certificados autoassinados para seu binário, SASS_REJECT_UNAUTHORIZED substituirá (rejectUnauthorized)[https://nodejs.org/docs/latest/api/tls.html#tls_tls_createserver_options_secureconnectionlistener].
O Install executa apenas dois testes Mocha para ver se sua máquina pode usar o LibSass pré-construído, o que economizará algum tempo durante a instalação. Se algum teste falhar, ele será compilado a partir do código-fonte.
Este módulo é oferecido a você e mantido pelas seguintes pessoas:
Michael Mifsud - Líder do Projeto (Github / Twitter)
Andrew Nesbitt (Github/Twitter)
Dean Mao (Github/Twitter)
Brett Wilkins (Github/Twitter)
Keith Cirkel (Github/Twitter)
Laurent Goderre (Github/Twitter)
Nick Schonning (Github/Twitter)
Adeel Mujahid (Github/Twitter)
Nós <3 nossos colaboradores! Um agradecimento especial a todos aqueles que dedicaram algum tempo de desenvolvimento neste projeto. Nós realmente apreciamos seu trabalho duro. Você pode encontrar uma lista completa dessas pessoas aqui.
Confira nosso guia de contribuição
Direitos autorais (c) 2015 Andrew Nesbitt. Consulte LICENÇA para obter detalhes.
