nodo descarado
v9.0.0
Advertencia: Node Sass ha llegado al final de su vida útil. No recibirá más versiones, ni siquiera para correcciones de seguridad. Los proyectos que todavía lo utilizan deberían pasar a Dart Sass.
Las versiones compatibles de Node.js varían según la versión; consulte la página de versiones.
Las versiones de nodo que lleguen al final de su vida útil https://github.com/nodejs/Release dejarán de ser compatibles en cada versión de node-sass (mayor, menor).
Dejaremos de crear archivos binarios para versiones no compatibles y de realizar pruebas para detectar fallas en la compatibilidad de dependencias, pero no bloquearemos las instalaciones para aquellos que quieran mantenerse a sí mismos.
La versión del nuevo nodo requiere cambios internos menores junto con el soporte de los proveedores de CI (AppVeyor, GitHub Actions). Abriremos un número único para que las partes interesadas se suscriban y cerraremos números adicionales.
A continuación se muestra una guía rápida para las versiones mínimas y máximas admitidas de node-sass:
| NodoJS | Versión de nodo-sass compatible | Módulo de nodo |
|---|---|---|
| Nodo 20 | 9.0+ | 115 |
| Nodo 19 | 8.0+ | 111 |
| Nodo 18 | 8.0+ | 108 |
| Nodo 17 | 7,0+, <8,0 | 102 |
| Nodo 16 | 6.0+ | 93 |
| Nodo 15 | 5,0+, <7,0 | 88 |
| Nodo 14 | 4,14+, <9,0 | 83 |
| Nodo 13 | 4,13+, <5,0 | 79 |
| Nodo 12 | 4,12+, <8,0 | 72 |
| Nodo 11 | 4,10+, <5,0 | 67 |
| Nodo 10 | 4,9+, <6,0 | 64 |
| Nodo 8 | 4.5.3+, <5.0 | 57 |
| Nodo <8 | <5.0 | <57 |
Le permite compilar de forma nativa archivos .scss a CSS a una velocidad increíble y automáticamente a través de un middleware de conexión.
Encuéntrelo en npm: https://www.npmjs.com/package/node-sass
Siga a @nodesass en Twitter para obtener actualizaciones de la versión: https://twitter.com/nodesass
npm instala nodo-sass
Algunos usuarios han informado problemas al instalar en Ubuntu debido a que node está registrado en otro paquete. Siga los documentos oficiales de NodeJS para instalar NodeJS para que #!/usr/bin/env node se resuelva correctamente.
La compilación en máquinas con Windows requiere los requisitos previos de node-gyp.
¿Estás viendo el siguiente error? Consulte nuestra guía de solución de problemas.**
SyntaxError: Use of const in strict mode.
¿Tiene problemas de instalación? Consulte nuestra guía de solución de problemas.
instalación npm -g mirror-config-china --registry=https://registry.npmmirror.com npm instala nodo-sass
var sass = require('nodo-sass');sass.render({
archivo: scss_filename,
[, opciones..]}, función(err, resultado) { /*...*/ });// ORvar resultado = sass.renderSync({
datos: scss_content
[, opciones..]}); Tipo: String
Predeterminado: null
Especial : se debe especificar file o data
Ruta a un archivo para que LibSass lo compile.
Tipo: String
Predeterminado: null
Especial : se debe especificar file o data
Una cadena para pasar a LibSass para compilar. Se recomienda utilizar includePaths junto con esto para que LibSass pueda encontrar archivos cuando utilice la directiva @import .
Esta es una característica experimental de LibSass. Úselo con precaución.
Tipo: Function | Function[] function(url, prev, done)
Predeterminado: undefined
Información y parámetros de función:
url (String) : la ruta en import as-is , que encontró LibSass
prev (String) : la ruta previamente resuelta
done (Function) : una función de devolución de llamada para invocar al finalizar asíncrono, toma un objeto literal que contiene
file (String) : una ruta alternativa para que LibSass use O
contents (String) : el contenido importado (por ejemplo, leído desde la memoria o el sistema de archivos)
Maneja cuando LibSass encuentra la directiva @import . Un importador personalizado permite la extensión del motor LibSass de forma sincrónica y asincrónica. En ambos casos, el objetivo es return o llamar done() con un objeto literal. Dependiendo del valor del objeto literal, sucederá una de dos cosas.
Al regresar o llamar done() con { file: "String" } , se asumirá la nueva ruta del archivo para @import . Se recomienda tener en cuenta el valor de prev en los casos en los que se requiera una resolución de ruta relativa.
Al devolver o llamar done() con { contents: "String" } , el valor de la cadena se utilizará como si el archivo se hubiera leído a través de una fuente externa.
A partir de v3.0.0:
this se refiere a un alcance contextual para la ejecución inmediata de sass.render o sass.renderSync
los importadores pueden devolver un error y LibSass emitirá ese error en respuesta. Por ejemplo:
done(new Error('¡no existe!'));// o regresar sincrónicamentereturn new Error('no hay nada que hacer aquí'); El importador puede ser una matriz de funciones, que LibSass llamará en el orden en que aparecen en la matriz. Esto ayuda al usuario a especificar un importador especial para un tipo particular de ruta (sistema de archivos, http). Si un importador no quiere manejar una ruta en particular, debe devolver null . Consulte la sección de funciones para obtener más detalles sobre los tipos de Sass.
Esta es una característica experimental de LibSass. Úselo con precaución.
functions es un Object que contiene una colección de funciones personalizadas que pueden ser invocadas por los archivos sass que se compilan. Pueden tomar cero o más parámetros de entrada y deben devolver un valor de forma sincrónica ( return ...; ) o asincrónica ( done(); ). Esos parámetros serán instancias de uno de los constructores contenidos en el hash require('node-sass').types . El valor de retorno también debe ser de uno de estos tipos. Vea la lista de tipos disponibles a continuación:
getValue() / setValue(value) : obtiene/establece la porción numérica del número
getUnit() / setUnit(unit) : obtiene/establece la porción unitaria del número
getValue() / setValue(value) : obtiene/establece la cadena adjunta
getR() / setR(value) : componente rojo (entero de 0 a 255 )
getG() / setG(value) : componente verde (entero de 0 a 255 )
getB() / setB(value) : componente azul (entero de 0 a 255 )
getA() / setA(value) : componente alfa (número de 0 a 1.0 )
Ejemplo:
var Color = require('node-sass').types.Color,
c1 = nuevo Color(255, 0, 0),
c2 = nuevo Color(0xff0088cc); getValue() : obtiene el booleano adjunto
types.Boolean.TRUE : instancia única de types.Boolean que es "verdadero"
types.Boolean.FALSE : instancia única de types.Boolean que contiene "falso"
getValue(index) / setValue(index, value) : value debe ser en sí mismo una instancia de uno de los constructores en sass.types .
getSeparator() / setSeparator(isComma) : si se deben utilizar comas como separador
getLength()
getKey(index) / setKey(index, value)
getValue(index) / setValue(index, value)
getLength()
types.Null.NULL : instancia única de types.Null .
sass.renderSync({
datos: '#{headings(2,5)} { color: #08c; }',
funciones: {'encabezados($de: 0, $a: 6)': función(de, a) { var i, f = from.getValue(), t = to.getValue(), lista = new sass.types .Lista(t - f + 1); for (i = f; i <= t; i++) {list.setValue(i - f, new sass.types.String('h' + i)); } lista de retorno;}
}}); Tipo: Array
Por defecto: []
Una serie de rutas que LibSass puede buscar para intentar resolver sus declaraciones @import . Cuando utilice data , se recomienda utilizar esto.
Tipo: Boolean
Predeterminado: false
Los valores true habilitan la sintaxis con sangría Sass para analizar la cadena de datos o el archivo.
Nota: node-sass/libsass compilará una biblioteca mixta de archivos scss y de sintaxis con sangría (.sass) con la configuración predeterminada (false) siempre que se utilicen las extensiones .sass y .scss en los nombres de archivos.
Tipo: String
Predeterminado: space
Se utiliza para determinar si se debe utilizar un espacio o un carácter de tabulación para la sangría.
Tipo: Number
Predeterminado: 2
Máximo: 10
Se utiliza para determinar la cantidad de espacios o tabulaciones que se utilizarán para la sangría.
Tipo: String
Predeterminado: lf
Se utiliza para determinar si se debe utilizar la secuencia cr , crlf , lf o lfcr para el salto de línea.
Tipo: Boolean
Predeterminado: false
Especial: al usar esto, también debes especificar outFile para evitar comportamientos inesperados.
Los valores true desactivan la inclusión de información del mapa de origen en el archivo de salida.
Tipo: String | null
Predeterminado: null
Especial: obligatorio cuando sourceMap es un valor veraz
Especifique la ubicación deseada del archivo de salida. Se recomienda encarecidamente al generar mapas de origen para que puedan consultar correctamente los archivos previstos.
Atención , al habilitar esta opción no se escribirá el archivo en el disco, es solo para fines de referencia interna (para generar el mapa, por ejemplo).
Ejemplo de cómo escribirlo en el disco.
sass.render({...outFile: surutaalarchivo,
}, function(error, result) { // devolución de llamada estilo nodo desde v3.0.0 en adelanteif(!error){ // No hay errores durante la compilación, escribe este resultado en el disco fs.writeFile(yourPathTotheFile, result.css, function (err){if(!err){ //archivo escrito en el disco} });}
});}); Tipo: String
Valor predeterminado: nested
Valores: nested , expanded , compact , compressed
Determina el formato de salida del estilo CSS final.
Tipo: Integer
Predeterminado: 5
Se utiliza para determinar cuántos dígitos después del decimal se permitirán. Por ejemplo, si tuviera un número decimal de 1.23456789 y una precisión de 5 , el resultado será 1.23457 en el CSS final.
Tipo: Boolean
Predeterminado: false
true Permite que el número de línea y el archivo donde se define un selector se emitan en el CSS compilado como comentario. Útil para depurar, especialmente cuando se utilizan importaciones y mixins.
Tipo: Boolean | String | undefined
Predeterminado: undefined
Habilita la generación de mapas de origen durante render y renderSync .
Cuando sourceMap === true , el valor de outFile se utiliza como ubicación de salida de destino para el mapa de origen con el sufijo .map adjunto. Si no se establece ningún outFile , se ignora el parámetro sourceMap .
Cuando typeof sourceMap === "string" , el valor de sourceMap se utilizará como ubicación de escritura para el archivo.
Tipo: Boolean
Predeterminado: false
true incluye el contents de la información del mapa fuente
Tipo: Boolean
Predeterminado: false
true incorpora el mapa fuente como un URI de datos
Tipo: String
Predeterminado: undefined
el valor se emitirá como sourceRoot en la información del mapa fuente
render devolución de llamada (>= v3.0.0) node-sass admite devoluciones de llamadas asíncronas de estilo de nodo estándar con la firma de function(err, result) . En condiciones de error, el argumento error se completa con el objeto de error. En condiciones exitosas, el objeto result se completa con un objeto que describe el resultado de la llamada de renderizado.
message (Cadena): el mensaje de error.
line (Número): el número de línea del error.
column (Número): el número de columna del error.
status (Número): el código de estado.
file (Cadena): el nombre del archivo del error. En caso de que no se haya configurado la opción file (a favor de data ), esto reflejará el valor stdin .
css (Buffer): el CSS compilado. Escriba esto en un archivo o sírvalo según sea necesario.
map (Buffer): el mapa fuente
stats (Objeto): un objeto que contiene información sobre la compilación. Contiene las siguientes claves:
entry (Cadena): la ruta al archivo scss o data si la fuente no era un archivo
start (Número) - Date.now() antes de la compilación
end (Número) - Date.now() después de la compilación
duration (Número) - fin - inicio
includedFiles (Array): rutas absolutas a todos los archivos scss relacionados sin ningún orden en particular.
var sass = require('nodo-sass');sass.render({
archivo: '/ruta/a/miArchivo.scss',
datos: 'cuerpo{fondo:azul; a{color:negro;}}',
importador: función (url, anterior, hecho) {// url es la ruta en la importación tal como está, que encontró LibSass.// prev es la ruta resuelta previamente.// hecho es una devolución de llamada opcional, consúmala o devuelva el valor sincrónicamente .// this.options contiene este hash de opciones, this.callback contiene la devolución de llamada de estilo nodosomeAsyncFunction(url, prev, function(result){ done({file: result.path, // solo uno de son obligatorios, consulte la sección Comportamientos especiales.contents: result.data });});// ORvar result = someSyncFunction(url, prev);return {file: result.path, content: result.data};
},
includePaths: [ 'lib/', 'mod/' ],
estilo de salida: 'comprimido'}, función (error, resultado) { // devolución de llamada de estilo de nodo desde v3.0.0 en adelante
si (error) {console.log(error.status); // solía ser "código" en v2x y debajoconsole.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());// o betterconsole.log(JSON.stringify(result. mapa)); // nota, JSON.stringify también acepta Buffer
}});// resultado ORvar = sass.renderSync({
archivo: '/ruta/al/archivo.scss',
datos: 'cuerpo{fondo:azul; a{color:negro;}}',
estilo de salida: 'comprimido',
archivo de salida: '/a/mi/salida.css',
sourceMap: verdadero, // o una ruta absoluta o relativa (a outFile)
importador: función (url, anterior, hecho) {// url es la ruta en la importación tal como está, que encontró LibSass.// prev es la ruta resuelta previamente.// hecho es una devolución de llamada opcional, consúmala o devuelva el valor sincrónicamente .// this.options contiene estas opciones hashsomeAsyncFunction(url, prev, function(result){ done({file: result.path, // solo se requiere una de ellas, consulte la sección Especial Behaviours.contents: result.data });});// ORvar result = someSyncFunction(url, prev);return {file: result.path, content: result.data};
}});console.log(resultado.css);console.log(resultado.map);console.log(resultado.stats); En el caso de que estén configuradas las opciones file y data , node-sass dará prioridad a data y utilizará file para calcular rutas en los mapas fuente.
La información de la versión node-sass y libsass ahora se expone mediante el método info :
var sass = require('node-sass');console.log(sass.info);/* generará algo como: node-sass 2.0.1 (Wrapper) [JavaScript] libsass 3.1.0 (Compilador Sass) [ C/C++]*/Dado que node-sass >=v3.0.0, la versión de LibSass se determina en tiempo de ejecución.
Listado de usos comunitarios de node-sass en marcos y herramientas de compilación.
@jasonsanjose ha creado una extensión de Brackets basada en node-sass: https://github.com/jasonsanjose/brackets-sass. Al editar archivos Sass, la extensión compila los cambios al guardarlos. La extensión también se integra con Live Preview para mostrar los cambios de Sass en el navegador sin guardar ni compilar.
El complemento sass oficial de Brunch usa node-sass de forma predeterminada y automáticamente recurre a Ruby si se detecta el uso de Compass: https://github.com/brunch/sass-brunch
Vuelva a compilar archivos .scss automáticamente para servidores http basados en Connect y Express.
Esta funcionalidad se ha movido a node-sass-middleware en node-sass v1.0.0
@10xLaCroixDrinker escribió un complemento DocPad que compila archivos .scss usando node-sass: https://github.com/docpad/docpad-plugin-nodesass
@stephenway ha creado una extensión que transpila Sass a CSS usando node-sass con duo.js https://github.com/duojs/sass
@sindresorhus ha creado un conjunto de tareas pesadas basadas en node-sass: https://github.com/sindresorhus/grunt-sass
@dlmanning ha creado un complemento gulp sass basado en node-sass: https://github.com/dlmanning/gulp-sass
El servidor web Harp de @sintaxi compila implícitamente archivos .scss usando node-sass: https://github.com/sintaxi/harp
@stevenschobert ha creado un complemento metalsmith basado en node-sass: https://github.com/stevenschobert/metalsmith-sass
@fourseven ha creado un complemento de meteoritos basado en node-sass: https://github.com/fourseven/meteor-scss
@dbashford ha creado un módulo Mimosa para sass que incluye node-sass: https://github.com/dbashford/mimosa-sass
También hay un ejemplo de aplicación de conexión aquí: https://github.com/andrew/node-sass-example
Node-sass incluye binarios precompilados para plataformas populares. Para agregar un binario para su plataforma, siga estos pasos:
Mira el proyecto:
git clone --recursivo https://github.com/sass/node-sass.gitcd node-sass instalación npm scripts de nodo/build -f # use el modificador -d para la versión de depuración# si tiene éxito, generará y moverá# el binario en el directorio de proveedores.
La interfaz para el uso de la línea de comandos es bastante simplista en esta etapa, como se ve en la siguiente sección de uso.
La salida se enviará a stdout si se omite el indicador --output .
node-sass [options] [output] O: cat | node-sass > output
Ejemplo:
node-sass src/style.scss dest/style.css
Opciones:
-w, --watch Mirar un directorio o archivo
-r, --recursive Observa directorios o archivos de forma recursiva
-o, --output Directorio de salida
-x, --omit-source-map-url Omitir el comentario de la URL del mapa fuente de la salida
-i, --indented-syntax Trata los datos de la entrada estándar como código sass (frente a scss)
-q, --quiet Suprime la salida del registro excepto en caso de error
-v, --version Imprime la información de la versión
--output-style Estilo de salida CSS (anidado | expandido | compacto | comprimido)
--indent-type Tipo de sangría para CSS de salida (espacio | tabulación)
--indent-width Ancho de sangría; número de espacios o tabulaciones (valor máximo: 10)
--linefeed Estilo de salto de línea (cr | crlf | lf | lfcr)
--source-comments Incluye información de depuración en la salida
--source-map Emitir mapa fuente
--source-map-contents Insertar incluir contenidos en el mapa
--source-map-embed Incrustar sourceMappingUrl como URI de datos
--source-map-root Ruta base, se emitirá en el mapa fuente tal cual
--include-path Ruta para buscar archivos importados
--follow Seguir directorios enlazados simbólicamente
--precision La cantidad de precisión permitida en números decimales
--error-bell Genera un carácter de campana en caso de errores
--importer Ruta al archivo .js que contiene el importador personalizado
--functions Ruta al archivo .js que contiene funciones personalizadas
--help Imprimir información de uso La input puede ser un único .scss o .sass , o un directorio. Si la entrada es un directorio, también se debe proporcionar el indicador --output .
Además, tenga en cuenta que --importer toma la ruta (absoluta o relativa a pwd) a un archivo js, que debe tener un module.exports predeterminado configurado para la función de importación. Vea, por ejemplo, nuestros dispositivos de prueba.
La opción --source-map acepta un valor booleano, en cuyo caso reemplaza la extensión de destino con .css.map . También acepta la ruta al archivo .map e incluso la ruta al directorio deseado. Al compilar un directorio, --source-map puede ser un valor booleano o un directorio.
node-sass admite diferentes parámetros de configuración para cambiar las configuraciones relacionadas con el binario sass, como el nombre binario, la ruta binaria o la ruta de descarga alternativa. Node-sass admite los siguientes parámetros:
| Nombre de la variable | parámetro .npmrc | Argumento del proceso | Valor |
|---|---|---|---|
| SASS_BINARY_NAME | nombre_binario_sass | --sass-nombre-binario | camino |
| SASS_BINARY_SITE | sitio_binario_sass | --sass-sitio-binario | URL |
| SASS_BINARY_PATH | ruta_binaria_sass | --sass-ruta-binaria | camino |
| SASS_BINARY_DIR | sass_binary_dir | --sass-binario-dir | camino |
| SASS_REJECT_UNAUTHORIZED | sass_reject_unauthorized | --sass-reject-no autorizado | valor |
Estos parámetros se pueden utilizar como variable de entorno:
Por ejemplo, export SASS_BINARY_SITE=http://example.com/
Como archivo de configuración .npmrc local o global:
Por ejemplo, sass_binary_site=http://example.com/
Como argumento del proceso:
Por ejemplo, npm install node-sass --sass-binary-site=http://example.com/
Si está utilizando certificados autofirmados para su binario, SASS_REJECT_UNAUTHORIZED anulará (rechazará no autorizado) [https://nodejs.org/docs/latest/api/tls.html#tls_tls_createserver_options_secureconnectionlistener].
La instalación ejecuta solo dos pruebas de Mocha para ver si su máquina puede usar LibSass prediseñado, lo que ahorrará algo de tiempo durante la instalación. Si alguna prueba falla, se compilará desde la fuente.
Este módulo es presentado y mantenido por las siguientes personas:
Michael Mifsud - Líder del proyecto (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)
Nosotros <3 nuestros colaboradores! Un agradecimiento especial a todos aquellos que dedicaron algo de tiempo a desarrollar este proyecto. Realmente apreciamos su arduo trabajo. Puede encontrar una lista completa de esas personas aquí.
Consulte nuestra guía de contribución
Copyright (c) 2015 Andrew Nesbitt. Consulte LICENCIA para obtener más detalles.
