{"id":48526609,"url":"https://github.com/kodiyak/modpack","last_synced_at":"2026-04-07T22:33:01.396Z","repository":{"id":302403806,"uuid":"1010450706","full_name":"kodiyak/modpack","owner":"kodiyak","description":"⚡ A flexible, browser-first module system powered by es-module-shims.","archived":false,"fork":false,"pushed_at":"2025-07-26T05:16:57.000Z","size":2326,"stargazers_count":2,"open_issues_count":1,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-11-30T03:44:45.787Z","etag":null,"topics":["es-module-shims","esm","javascript","module-resolver","open-source","runtime","sandbox","typescript","zero-config"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/kodiyak.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"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,"zenodo":null}},"created_at":"2025-06-29T05:11:51.000Z","updated_at":"2025-07-26T00:45:38.000Z","dependencies_parsed_at":"2025-07-18T15:15:52.840Z","dependency_job_id":"5407a835-195a-4a60-a2c2-d5a9cb500230","html_url":"https://github.com/kodiyak/modpack","commit_stats":null,"previous_names":["kodiyak/modbox","kodiyak/modpack"],"tags_count":6,"template":false,"template_full_name":null,"purl":"pkg:github/kodiyak/modpack","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kodiyak%2Fmodpack","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kodiyak%2Fmodpack/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kodiyak%2Fmodpack/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kodiyak%2Fmodpack/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/kodiyak","download_url":"https://codeload.github.com/kodiyak/modpack/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kodiyak%2Fmodpack/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31532327,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-07T16:28:08.000Z","status":"ssl_error","status_checked_at":"2026-04-07T16:28:06.951Z","response_time":105,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["es-module-shims","esm","javascript","module-resolver","open-source","runtime","sandbox","typescript","zero-config"],"created_at":"2026-04-07T22:33:00.804Z","updated_at":"2026-04-07T22:33:01.386Z","avatar_url":"https://github.com/kodiyak.png","language":"TypeScript","readme":"# Modpack - Modular and Flexible TypeScript/JavaScript Runtime\n\n## Introduction\n\n**Modpack** is a modular JavaScript runtime that allows you to run JavaScript and TypeScript code in a flexible and isolated environment, built on top of `es-module-shims`. It supports various plugins for module resolution, caching, and code transformation, redefining how modules are processed at runtime.\n\n### Why Modpack?\n\nIn today's web development, rigid build tools often limit innovation. Modpack offers a powerful alternative for scenarios demanding **unprecedented control** over module handling. It helps you:\n\n- **Gain Granular Control:** Fine-tune every step of module processing, moving beyond monolithic bundlers.\n- **Embrace Extreme Modularity:** Build custom pipelines by adding, removing, or reordering plugins.\n- **Power Dynamic Environments:** Perfect for code playgrounds, online editors, and any app needing real-time code manipulation.\n- **Leverage Modern Tech:** We stand on the shoulders of giants, orchestrating `es-module-shims` for robust module loading and `SWC-Wasm` for blazing-fast code transformations directly in the browser.\n\n### Installation\n\nLet's walk through a simple example to get Modpack up and running. This demo will show you how to set up Modpack with essential plugins to load, transform, and execute a simple React component from our virtual file system.\n\n```package-install\n@modpack/core @modpack/plugins\n```\n\n### Import Modpack\n\n```ts\nimport { Modpack } from \"@modpack/core\";\nimport {\n  cache,\n  external,\n  logger,\n  resolver,\n  swc,\n  virtual,\n} from \"@modpack/plugins\";\n```\n\n### Create a Modpack Instance\n\n```ts\nconst modpack = await Modpack.boot({\n  debug: false, // Set to true for debugging\n  plugins: [\n    // **resolver**: Handles how module paths are found, supporting aliases (`@/`) and file extensions.\n    resolver({\n      extensions: [\".js\", \".ts\", \".tsx\", \".jsx\"],\n      alias: { \"@/\": \"/src/\" },\n      index: true,\n    }),\n    // **cache**: Optimizes fetching by storing and serving previously loaded modules.\n    cache(),\n    // **virtual**: Enables Modpack to read modules directly from its in-memory file system (`modpack.fs`).\n    virtual(),\n    // **external**: Resolves and fetches modules from external URLs, like CDNs (e.g., from `https://esm.sh/*`).\n    external(),\n    // **swc**: Transforms your TypeScript and JSX code into standard JavaScript, essential for React.\n    swc({\n      extensions: [\".js\", \".ts\", \".tsx\", \".jsx\"],\n      jsc: {\n        target: \"es2022\",\n        parser: {\n          syntax: \"typescript\",\n          tsx: true,\n        },\n      },\n      sourceMaps: true,\n      module: {\n        type: \"es6\",\n        strict: false,\n        ignoreDynamic: true,\n        importInterop: \"swc\",\n      },\n    }),\n    // **logger**: Provides detailed logs of Modpack's operations, very useful for debugging your pipeline.\n    logger(),\n  ],\n});\n```\n\n### Minimal React Application\n\n```ts\nmodpack.fs.writeFile(\n  \"/main.jsx\",\n  `import { createRoot } from 'react-dom/client'\n  import { useState } from 'react';\n\n  const Application = () =\u003e {\n    const [count, setCount] = useState(0);\n    return (\n      \u003cdiv\u003e\n        \u003ch1\u003eCount: {count}\u003c/h1\u003e\n        \u003cbutton onClick={() =\u003e setCount(count + 1)}\u003eIncrement\u003c/button\u003e\n        \u003cbutton onClick={() =\u003e setCount(count - 1)}\u003eDecrement\u003c/button\u003e\n      \u003c/div\u003e\n    )\n  }\n\n  createRoot(document.getElementById('modpackRoot')).render(\n    \u003cApplication /\u003e,\n  )`\n);\n```\n\n### Run the Module\n\nFinally, tell Modpack which module to load and execute.\n\n```ts\nawait modpack.mount(\"/main.jsx\");\n```\n\nAfter calling `modpack.mount()`, Modpack will process `/main.jsx` through its configured pipeline:\n\n1. The virtual plugin's resolver identifies `/main.jsx` in the virtual file system.\n2. The virtual plugin's fetcher retrieves the content of `/main.jsx` from `modpack.fs`.\n3. The `swc` transformer transpiles the JSX/TypeScript code into standard JavaScript.\n4. The JavaScript code is then executed in your environment, rendering the React Application component into the `\u003cdiv id=\"modpackRoot\"\u003e\u003c/div\u003e` element you prepared.\n5. You should now see the React counter application running in your browser!\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkodiyak%2Fmodpack","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkodiyak%2Fmodpack","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkodiyak%2Fmodpack/lists"}