Usa sublime para compilar menos y sass

Sass and Less es un lenguaje de estilo dinámico, que es una especie de lenguaje de preprocesamiento de CSS, y un lenguaje de extensión de CSS. Utiliza una sintaxis similar a CSS y proporciona características de lenguaje dinámico de CSS, como variables, herencia, cálculos, etc. Funciones , etc., facilitan la escritura y el mantenimiento de CSS.

Uno, usa sublime para compilar menos

1. Use menos para convertir archivos css

  • Instale complementos less, lessc, Less2Css en Sublime

  • Instale Node.js y opere a continuación directamente.
    URL: https://nodejs.org/en/download/

  • Abra la consola (win + R, ingrese cmd), ingrese node -v para verificar si el nodo está instalado,

    Para instalar Less globalmente, ingrese npm install less -g (ingrese lessc -v para verificar que Less esté instalado).

  • Ingrese npm install -g less-plugin-clean-css Este es un complemento

  • Cree un nuevo archivo less en Sublime, y luego presione ctrl + s para guardar, y el archivo css se generará automáticamente.

2. Introduzca menos archivos y archivos less.js (de uso común)

  • // 自己写的less文件
    <link rel="stylesheet/less" type="text/less" href="1.less" />
    
      //引入编译less文件的js文件
    <script src="less.min.js" type="text/javascript"></script>  
  • Descargue la URL de cada versión de less.js:

    https://github.com/less/less.js/releases

En segundo lugar, use sublime para compilar sass

1. ¿Cuál es la diferencia entre Sass y SCSS?

Sass y SCSS son en realidad lo mismo. Normalmente lo llamamos Sass. Las diferencias entre los dos son las siguientes:

(1). Las extensiones de archivo son diferentes. Sass usa el sufijo ".sass" como extensión, mientras que SCSS usa el sufijo ".scss" como extensión

(2). La gramática es diferente. Sass está escrito en estrictas reglas gramaticales con sangría, sin llaves ({}) y punto y coma (;). La escritura gramatical de SCSS es muy similar a nuestra escritura gramatical CSS. Similar

2. Utilice Sass para convertir archivos css

  • Instale los complementos scss, sass, sassbuild en Sublime

  • SASS está escrito en lenguaje Ruby, pero la sintaxis de los dos no está relacionada. No conozco a Ruby, así que todavía lo uso. Solo tienes que instalar Ruby primero , luego SASS

  • Sitio web de Ruby: http://www.ruby-lang.org/en/downloads/

  • Al instalar, marque la opción Agregar ejecutables de Ruby a su RUTA para agregar variables de entorno; de lo contrario, se le pedirá que busque el entorno de Ruby cuando utilice el software compilado en el futuro.

  • Abra la consola (win + R, ingrese cmd), ingrese Ruby -v para verificar que Ruby esté instalado

  • Instale Node.js y opere a continuación directamente.
    URL: https://nodejs.org/en/download/

  • Abra la consola (win + R, ingrese cmd), ingrese node -v para verificar si el nodo está instalado,

  • Para instalar sass globalmente, ingrese gem install sass (ingrese sass -v para verificar que sass esté instalado).

  • Cree un nuevo archivo scss en Sublime, luego presione ctrl + S para guardar, y luego presione ctrl + B para generar automáticamente un archivo css.

  • Nota: cuando utilice sublim para compilar archivos scss, asegúrese de compilar en una ruta que no sea china

--------------sobre----------------

Autor: Cai Guoqing (Xiao Zhu)

Supongo que te gusta

Origin blog.csdn.net/it_cgq/article/details/78718208
Recomendado
Clasificación