Sass71 VSCode Extension

Descripción

Esta extensión para Visual Studio Code genera una estructura de carpetas y archivos Sass predefinida. Incluye la creación de archivos parciales con nombres que comienzan con un guion bajo y configura el archivo principal main.scss con importaciones para cada uno de estos archivos parciales.

Características

1. Crea las siguientes carpetas en la carpeta seleccionada:

   • assets/sass/abstracts
   • assets/sass/base
   • assets/sass/components
   • assets/sass/layout
   • assets/sass/pages
   • assets/sass/themes
   • assets/sass/vendors

2. Dentro de cada carpeta, crea los archivos parciales correspondientes:

   • abstracts: _variables.scss, _functions.scss, _mixins.scss, _placeholders.scss
   • base: _reset.scss, _typography.scss
   • components: _buttons.scss, _carousel.scss, _cover.scss, _dropdown.scss
   • layout: _navigation.scss, _grid.scss, _header.scss, _footer.scss, _sidebar.scss, _forms.scss
   • pages: _home.scss, _contact.scss
   • themes: _theme.scss, _admin.scss
   • vendors: _bootstrap.scss, _jquery-ui.scss

3. Crea un archivo main.scss en assets/sass con las siguientes importaciones:

@import 'abstracts/variables';
@import 'abstracts/functions';
@import 'abstracts/mixins';
@import 'abstracts/placeholders';

@import 'vendors/bootstrap';
@import 'vendors/jquery-ui';

@import 'base/reset';
@import 'base/typography';

@import 'layout/navigation';
@import 'layout/grid';
@import 'layout/header';
@import 'layout/footer';
@import 'layout/sidebar';
@import 'layout/forms';

@import 'components/buttons';
@import 'components/carousel';
@import 'components/cover';
@import 'components/dropdown';

@import 'pages/home';
@import 'pages/contact';

@import 'themes/theme';
@import 'themes/admin';

Uso

1. Abre VSCode y carga la extensión.
2. Usa la Paleta de Comandos (Ctrl+Shift+P) y busca Create Sass Structure.
3. Selecciona la carpeta donde deseas crear la estructura de Sass.

Enlaces

• Repositorio de la extensión: https://github.com/Giovasdf/sass71

¡Gracias por usar Sass71!