https://github.com/jeff-aporta/ascii-maploader
Lenguaje interpretado diseñado para cargar dependencias de archivos .jsx, .js, y .css en proyectos web.
https://github.com/jeff-aporta/ascii-maploader
ascii dependencies javascript loader loaders map mjs real-time
Last synced: 4 months ago
JSON representation
Lenguaje interpretado diseñado para cargar dependencias de archivos .jsx, .js, y .css en proyectos web.
- Host: GitHub
- URL: https://github.com/jeff-aporta/ascii-maploader
- Owner: Jeff-Aporta
- Created: 2024-10-30T21:26:36.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-03-13T08:08:53.000Z (over 1 year ago)
- Last Synced: 2025-07-16T07:36:33.823Z (11 months ago)
- Topics: ascii, dependencies, javascript, loader, loaders, map, mjs, real-time
- Language: JavaScript
- Homepage: https://jeff-aporta.github.io/ascii-maploader/
- Size: 364 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
# ASCII Map Loader
Documentación:
https://jeff-aporta.github.io/ascii-maploader/
**ASCII Map Loader** es un lenguaje interpretado diseñado para cargar dependencias de archivos `.jsx`, `.js`, y `.css` en proyectos web. Su principal característica es la capacidad de inyectar estos elementos en tiempo real al cargar un documento HTML, usando la función `document.write()`. Esto lo hace ideal para desarrollos que involucren múltiples módulos y para verificar la compatibilidad de archivos `.mjs` en páginas estáticas o aplicaciones que necesiten ser cargadas directamente en el cliente.
## Instalación
### Usando CDN
Para integrar **ASCII Map Loader** en tu proyecto, simplemente añade la siguiente URL en tu archivo HTML:
```html
```
Esto permitirá que tu aplicación utilice las funcionalidades de **ASCII Map Loader** para estructurar y gestionar las dependencias de manera programada y visual.
### Usando npm
Si prefieres usar npm, ejecuta el siguiente comando en tu terminal:
```bash
npm install ascii-maploader --save
```
Luego, en tu código JavaScript, importa el módulo con:
```javascript
import asciiMap from "ascii-maploader";
```
## Funciones del Módulo
### Estructuración de Cascada
- **tree**: Inicia la generación de un árbol para organizar las dependencias en cascada.
### Funciones de Carga
- **writehtml**: Inserta las dependencias generadas directamente en el documento HTML.
### CLI
Incluye un gestor que facilita la vinculación a bibliotecas populares como React y Babel.
```javascript
/*
Dependencias
- react 18.3.1
- babel 7.25.5
- MaterialUI 5.16.7
- FontAwesome 6.4.2
*/
asciiMap.CLI.react_mui_fa();
//Dependencia fluid CSS
//https://github.com/Jeff-Aporta/fluid-css
asciiMap.CLI.fluidCSS();
```
### Funciones de Conversión
- **html**: Retorna un arreglo de etiquetas `` y `` que representan las dependencias.
- **json**: Devuelve un JSON que representa la estructura de dependencias.
## Ejemplo de Uso
```javascript
asciiMap
.tree("public")
.subDir("ex-branch", (branch) => {
branch.css("style").js("script").jsx("App");
})
.writehtml();
```
El código anterior generará e insertará en tu HTML las etiquetas de importación necesarias, manteniendo un código limpio y organizado para tus dependencias.