{"id":13806453,"url":"https://github.com/lifeart/ember-ast-hot-load","last_synced_at":"2025-04-13T04:12:12.766Z","repository":{"id":33262592,"uuid":"156615537","full_name":"lifeart/ember-ast-hot-load","owner":"lifeart","description":"Universal hot-load addon for Ember applications. Support classic/pods/mu layouts and route templates reloading.","archived":false,"fork":false,"pushed_at":"2023-10-09T10:32:02.000Z","size":3443,"stargazers_count":92,"open_issues_count":25,"forks_count":17,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-03-24T08:43:20.898Z","etag":null,"topics":["addon","ember","ember-addon","ember-cli","emberjs","hot-module-replacement","hot-reload","hot-reloading"],"latest_commit_sha":null,"homepage":"","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/lifeart.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2018-11-07T22:16:34.000Z","updated_at":"2024-12-30T16:40:48.000Z","dependencies_parsed_at":"2023-02-17T18:16:03.930Z","dependency_job_id":"807190ef-8cbd-4f2b-a036-d1baf2cbfa2c","html_url":"https://github.com/lifeart/ember-ast-hot-load","commit_stats":{"total_commits":406,"total_committers":22,"mean_commits":"18.454545454545453","dds":0.2586206896551724,"last_synced_commit":"68375290087b96446e57e20190ffbace96ff7687"},"previous_names":[],"tags_count":28,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lifeart%2Fember-ast-hot-load","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lifeart%2Fember-ast-hot-load/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lifeart%2Fember-ast-hot-load/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lifeart%2Fember-ast-hot-load/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/lifeart","download_url":"https://codeload.github.com/lifeart/ember-ast-hot-load/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248198879,"owners_count":21063627,"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":["addon","ember","ember-addon","ember-cli","emberjs","hot-module-replacement","hot-reload","hot-reloading"],"created_at":"2024-08-04T01:01:11.939Z","updated_at":"2025-04-13T04:12:12.743Z","avatar_url":"https://github.com/lifeart.png","language":"JavaScript","funding_links":[],"categories":["Packages"],"sub_categories":["End-user customization"],"readme":"ember-ast-hot-load [![npm version](https://badge.fury.io/js/ember-ast-hot-load.svg)](https://badge.fury.io/js/ember-ast-hot-load) [![Build Status](https://travis-ci.com/lifeart/ember-ast-hot-load.svg?branch=master)](https://travis-ci.com/lifeart/ember-ast-hot-load) [![Greenkeeper badge](https://badges.greenkeeper.io/lifeart/ember-ast-hot-load.svg)](https://greenkeeper.io/) [![Maintainability](https://api.codeclimate.com/v1/badges/a0fc242c64b9f50cc92d/maintainability)](https://codeclimate.com/github/lifeart/ember-ast-hot-load/maintainability)\n==============================================================================\n\n### Any ember components hot-reloading\n\nMain Idea of this addon - ability to reload changed components without application reloading.\n\nThis addon is continuation of the project [ember-cli-hot-loader](https://github.com/adopted-ember-addons/ember-cli-hot-loader) and  includes part of it's codebase.\n\n* __ember-cli__ \u003e= `2.15.1`\n* __ember-source__ \u003e= `2.16`\n\nMany thanks to [Toran Billups / @toranb](https://github.com/toranb) for this huge work, support and inspiration!\n\n* `ember-cli-hot-loader` implemented using middleware for  `ember-resolver` and `wrapping` components.\n* `ember-ast-hot-load` implemented using compile-time templates `ast` transformations.\n\n| Point  \t\t      | ember-ast-hot-load | ember-cli-hot-loader |\n| ------------------  | ------------------ | -------------------- |\n| Tagless components  |          +         |           +/-        |\n| Glimmer components  |          +         |           -          |\n| Classic route templates |         +        |           -         |\n| MU route templates  |          +         |           -          |\n| reducers reloading  |          -         |           +          |\n| performance impact  |         low        |           middle     |\n| typescript support  |          +         |            +         |\n| Nested components   |          +         |           +/-        |\n| code limitations    |\t\t\t-\t\t   |            +         |\n| Ember 2.x           |          ?         |            +         |\n| Ember 3.4+          |          +         |            -         |\n| Fastboot            |          +         |            -         |\n| [Sparkles components](https://github.com/rwjblue/sparkles-component) |          +         |            -         |\n| [Hooked components](https://github.com/lifeart/hooked-components)   |          +         |            -         |\n| [Custom components](https://github.com/emberjs/rfcs/blob/master/text/0213-custom-components.md)   |          +         |            -         |\n| Component wrappers  |          -         |            +         |\n| AST integration     |          +         |            -         |\n| Resolver 5 support  |          +         |            -         |\n| MU support          |          +         |            -         |\n| Addons hot-reload   |          +         |            -         |\n\nInstallation\n------------------------------------------------------------------------------\n\n```\nember install ember-ast-hot-load\n```\n\n* Ember.js v3.20 or above\n* Ember CLI v3.20 or above\n* Node.js v10 or above\n\n\n## How to use this addon\n\n\nIt should just work without any config.\n\nAfter the installing, simply run `ember serve` as you normally would. Any changes to component JS/HBS files will result in a hot reload (not a full page reload). If you alter a route, service, or controller ember-cli will do a full page reload.\n\nHot-reloading Ember [helpers](https://guides.emberjs.com/v3.10.0/templates/writing-helpers/) is not supported.\n\nBecause helpers look like components (in the AST) they will be unnecessarily wrapped, e.g. `helper` -\u003e `dynamic component` -\u003e `helper`\n\nTo prevent this from happening, you can exclude helpers from the hot-loader pipeline by specifying a list of helper names in the add-on config.\n\n```js\n// ember-cli-build.js\nnew EmberApp(defaults, {\n  'ember-ast-hot-load': {\n    helpers: [\"foo-bar\", \"liquid-if\", ... ],\n    enabled: true\n  }\n});\n\n```\n\nIf you don't specify `helpers` in the config the addon will continue to work, but with it will also wrap all your helpers (you can see this in the `ember-inspector` components tab, e.g. `helper \"you-app-helper-name\"`).\n\nTo get a list of all the helpers in your app that hot-reload might think are components, run this script in a debug console in your browner. You can then use this list to configure the add-on.\n\n```js\nvar componentLikeHelpers = Object.keys(require.entries)\n    .filter(name=\u003e(name.includes('/helpers/')|| name.includes('/helper')))\n    .filter(name=\u003e!name.includes('/-')).map(name=\u003e{\n        let path = name.split('/helpers/');\n        return path.pop();\n    }).filter(name=\u003e!name.includes('/')).uniq();\n\nconsole.log(JSON.stringify(componentLikeHelpers))\n```\n\nYou should also exclude `ember-ast-hot-load` from production builds (to avoid unnecessary calculations)\n\n```js\n// ember-cli-build.js\nconst environment = EmberApp.env();\n// ...\nconst addonsToIgnoreInProdBuilds = [\n  environment === 'production' ? 'ember-ast-hot-load' : null\n].filter(name =\u003e name !== null);\n\nnew EmberApp(defaults, {\n  addons: {\n    blacklist: addonsToIgnoreInProdBuilds\n  }\n});\n```\n\n### Public API?\n\n```js\nservice('hot-loader')\n```\n\n```js\n.registerWillHotReload(onHotReload)\n```\n\n```js\n.unregisterWillHotReload(onHotReload)\n```\n\n```js\n.registerWillLiveReload(onLiveReload)\n```\n\n```js\n.unregisterWillLiveReload(onLiveReload)\n```\n\n ```js\n  // we need to prevent full app refresh if we can hande changed file.\n function onLiveReload(event) {\n    if (event.modulePath.includes('redusers')) {\n      event.cancel = true;\n      requirejs.unsee('some-module');\n    }\n }\n\n\n function onHotReload(path) {\n    if (path.includes('redusers')) {\n      // do some hot-reload magic,\n      // for example\n      requirejs.resolve('some-module')\n    }\n }\n ```\n\n## Known Compatibility Workarounds\n\n#### Serving your Ember app from a different backend (e.g. Rails)\n\nIn most development environments, Ember applications are served directly from Ember's development server, e.g. http://localhost:4200.\nIf you are using a different way of service your Ember app, you may need to override the URL that we use to reload your changes.\n\n```js\n  // config/enironment.js\n\n  if (environment === 'development') {\n    ENV['ember-ast-hot-load'] = {\n      baseUrl: 'http://app.mydomain.test:4200'\n    }\n  }\n```\n\n### Cannot find module\nCannot find module `ember-source\\dist\\ember-template-compiler.js` in yarn workspaces.\n\n`root.package.json` `workspaces.nohoist: [\"**/ember-ast-hot-load\"]`\n\n\nContributing\n------------------------------------------------------------------------------\n\n### Installation\n\n* `git clone \u003crepository-url\u003e`\n* `cd ember-ast-hot-load`\n* `yarn install`\n\n### Linting\n\n* `yarn lint:hbs`\n* `yarn lint:js`\n* `yarn lint:js --fix`\n\n### Running tests\n\n* `ember test` – Runs the test suite on the current Ember version\n* `ember test --server` – Runs the test suite in \"watch mode\"\n* `ember try:each` – Runs the test suite against multiple Ember versions\n\n### Running the dummy application\n\n* `ember serve`\n* Visit the dummy application at [http://localhost:4200](http://localhost:4200).\n\nFor more information on using ember-cli, visit [https://ember-cli.com/](https://ember-cli.com/).\n\nLicense\n------------------------------------------------------------------------------\n\nThis project is licensed under the [MIT License](LICENSE.md).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flifeart%2Fember-ast-hot-load","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flifeart%2Fember-ast-hot-load","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flifeart%2Fember-ast-hot-load/lists"}