{"id":21754164,"url":"https://github.com/csdev19/how-to-webpack","last_synced_at":"2025-03-21T03:14:06.950Z","repository":{"id":111232111,"uuid":"153051749","full_name":"csdev19/How-to-Webpack","owner":"csdev19","description":"Aqui hare mis resumenes de un curso de webpack y todo lo demas que encuentre acerca del tema","archived":false,"fork":false,"pushed_at":"2018-10-18T01:33:12.000Z","size":1073,"stargazers_count":0,"open_issues_count":1,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-01-25T23:43:54.917Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/csdev19.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-10-15T04:08:53.000Z","updated_at":"2018-10-18T01:33:14.000Z","dependencies_parsed_at":"2023-04-12T11:49:57.002Z","dependency_job_id":null,"html_url":"https://github.com/csdev19/How-to-Webpack","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/csdev19%2FHow-to-Webpack","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/csdev19%2FHow-to-Webpack/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/csdev19%2FHow-to-Webpack/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/csdev19%2FHow-to-Webpack/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/csdev19","download_url":"https://codeload.github.com/csdev19/How-to-Webpack/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244728235,"owners_count":20500023,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-26T09:13:00.302Z","updated_at":"2025-03-21T03:14:06.946Z","avatar_url":"https://github.com/csdev19.png","language":"JavaScript","readme":"# How-to-Webpack\n\nAqui hare mis resumenes de un curso de webpack y todo lo demas que encuentre acerca del tema\n\n## Que es Webpack ?\n\nWP es un Module Bundler for Modern JS Applications, es decir un empaquetador de módulos para el desarrollo de aplicaciones modernas en JavaScript.\nEn su definición sencilla y directa: Es un empaquetador de módulos.\nEn un contexto mas amplio: Tiene como objetivo principal agrupar los archivos de JavaScript (o sea los módulos, los require(’’./\")) para su uso en un navegador, pero también es capaz de transformar, agrupar o empacar muchos otros archivos como CSS (por ejemplo).\n\n\n\n![que es webpack](imgs/que-es-webpack.jpg \"que es webpack\")\n\n## ¿Por qué usar Webpack?\n\n- Aunque hay otras alternativas WP es un la forma mas sofisticada para cargar y transformar módulos. WP trae todas las formas de importación de módulos, en resumen trae lo mejor de todos los mundos (AMD y CommonJS).\n    - AMD: Asynchrounous Module Definition =\u003e lo usa require.js (usa mas peticiones)\n    - CommonJS: Sistema de modulos de nodejs ( una sola petición )\n- **Entrypoints:** Múltiples puntos de entrada a tus aplicaciones - archivos iniciales, tienes uno por cada pagina que vayas a usar. \n- Puedes tener multiples entrypoints.\n- **OUTPUT:** Si bien le decimos cual es el archivo fuente, debemos decirle que hacer con eso y donde ponerlo, porque no queremos mezclar los archivos finales que lee el navegador con los archivos fuente. En resumen responderemos a las siguientes preguntas:\n    - Donde estara el archivo.\n    - Como se llamara el archivo.\n- **Loaders:** Nos ayudan a cargar todo tipo de formato de archivos.\n- **Plugins:** nos ayudan a extender las caracteristicas de WP, por ejemplo comprimir archivos, dividir nuestros modulos en chunks, etc.\n- WP es developer experience.\n\n\n\n## Diferencia entre Webpack y otras herramientas \n\nIr al siguiente documento [webpack vs gulp vs grunt]().\n\n\n\n\n\n## Para usar todo lo que aprendamos\n\nCreare una carpeta llamada **configuracion total** donde pondre una configuracion total.\n\n\n\n\n\n\n\n\n\n\n\n\n\n## Colaboradores:\n\n- Cristian F. Sotomayor G. (Autor - Creador del repositorio)\n\n\n\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcsdev19%2Fhow-to-webpack","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcsdev19%2Fhow-to-webpack","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcsdev19%2Fhow-to-webpack/lists"}