Kit de arranque web avanzado
Ir audazmente a donde ningún hombre ha ido antes
Cómo usar
- Clon o descargar y desempacar la ubicación deseada
- Descargue e instale la última versión de Node.js
- Instale GraphicsMagick (recomendado) o ImageMagick para su sistema operativo. Nota: es obligatorio instalar uno de ellos antes de ejecutar
npm install - Establezca sus variables de entorno [guía]
- Instalar dependencias del proyecto:
npm install - (opcional) Agregue su repositorio a Travis para pruebas automáticas
- (opcional) Configure la implementación continua con Circleci o Werker Docker siguiendo nuestra guía
- Código en vivo con:
npm start o npm start -- --hmr si necesita recarga del módulo caliente - Construir con:
npm run build - Despliegue y disfrute de su vida
¿Qué hay dentro?
- Estructura razonable para proyectos frontend
- Generación de páginas estáticas
- Configuraciones preparadas para una implementación continua rápida y configuración de pruebas automáticas
- Grunt con tareas preconfiguradas
- Nunjucks, un motor de plantilla con todo el mundo
- Nunjucks Globals y filtros incorporados para el formato de números, fechas, obteniendo URL de página actual, localidad, breadcincrumb, etc.
- URL legibles en humanos
- Archivos de Boilerplate basados en las mejores prácticas
- I18N con Node-Gettext y diseños configurados para declarar correctamente las URL locales y alternativas actuales
- Compilador SASS con generación de mapas de origen, autoprofijo, optimización, minificación y pelusa
- Marco de ekzo sass
- Webpack con ES6 Soporte, administración y agrupación de dependencias de JavaScript y recarga opcional de módulo caliente o vigilancia rápida
- Estándar para pelucas y formato automático JavaScript
- Recarga en vivo con alimentación de Webpack-Dev-Server
- Anotación de tipo de ejecución y validación de datos con
tcomb y tcomb-validation , refinamientos útiles incorporados. - Metaetiquetas preconfiguradas para gráficos abiertos y tarjetas de Twitter
- Los datos estructurados de los proveedores de búsqueda comúnmente utilizados basados en RDFA
- Generación automática
sitemap.xml con gruñe-sitemap-xml - Generación automática de sprites con spritesmith
- Compresión de imágenes automáticas a través de tinypng
- Generación automática de imágenes receptivas con imágenes de respuesta a gruñidos
- Separar archivos no optimizados en el desarrollo, y
- Archivos compilados y minificados para la producción
Y mucho más debajo del capó. Simplemente no tuvimos tiempo para documentar todas las características. Todavía.
Documentación
Trabajo en progreso
- Estructura
- Variables de entorno
- Datos
- Datos estructurados
- URLS
- Entrega continua
- Recetas
Ejemplos
La versión implementada de Kotsu de Master Branch se puede encontrar aquí.
Tenga en cuenta que la sección de ejemplos hasta ahora presenta solo menos parte de elementos y características predefinidas.
Soporte de navegadores
Javascript
| ES DECIR | Borde | Cromo | Firefox | Safari | Ópera | Móvil de ópera | iOS safari | Androide |
|---|
| 9+ | 12+ | 21+ | 28+ | 6.1+ | 12.1+ | 12.1+ | 7+ | 4+ |
Para habilitar las características de ES6 en IE11 y debajo, import 'babel-polyfill' en main.js Vea los detalles aquí.
Construcción predeterminada enviada con jQuery 3.1.0+ que no admite IE8. Reemplácelo con la versión anterior a 3.0.0 si necesita soporte de IE8.
CSS
| ES DECIR | Borde | Cromo | Firefox | Safari | Ópera | Móvil de ópera | iOS safari | Androide |
|---|
| 10+ | 12+ | 21+ | 28+ | 6.1+ | 12.1+ | 12.1+ | 7.1+ | 4.4+ |
Consulte la sección de soporte de los navegadores EKZO para obtener detalles sobre la regresión elegante para IE9 y a continuación, que se incluye en Kotsu de forma predeterminada.
Para deshabilitar regresiones elegantes para el IE más antiguo, elimine la llamada macro IE() del diseño base.
Mensaje de navegador obsoleto
En IE9 y debajo, los usuarios verán banner antes del contenido de la página con un mensaje sobre el navegador obsoleto y el enlace al navegador obsoleto.
Para deshabilitar el mensaje de navegador obsoleto, elimine la llamada macro OutdatedBrowser() del diseño base.
Licencia
Copyright 2014 Lotustm. Licencia bajo la licencia Apache 2.0.