{"id":14955819,"url":"https://github.com/excid3/esbuild-rails","last_synced_at":"2025-04-07T16:17:42.395Z","repository":{"id":37468710,"uuid":"410277089","full_name":"excid3/esbuild-rails","owner":"excid3","description":"Esbuild Rails plugin","archived":false,"fork":false,"pushed_at":"2024-09-14T21:30:37.000Z","size":50,"stargazers_count":180,"open_issues_count":0,"forks_count":11,"subscribers_count":3,"default_branch":"main","last_synced_at":"2024-10-29T14:17:16.481Z","etag":null,"topics":["esbuild","hacktoberfest","hotwire","rails","rubyonrails","stimulusjs"],"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/excid3.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"MIT-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":"2021-09-25T13:16:13.000Z","updated_at":"2024-09-25T18:55:21.000Z","dependencies_parsed_at":"2024-06-18T22:51:46.772Z","dependency_job_id":"70fd4945-16db-4af3-b974-00b4089d475d","html_url":"https://github.com/excid3/esbuild-rails","commit_stats":{"total_commits":44,"total_committers":6,"mean_commits":7.333333333333333,"dds":"0.13636363636363635","last_synced_commit":"e9609d5b509e6b3d9b3cb836fc9125be34901d04"},"previous_names":[],"tags_count":8,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/excid3%2Fesbuild-rails","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/excid3%2Fesbuild-rails/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/excid3%2Fesbuild-rails/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/excid3%2Fesbuild-rails/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/excid3","download_url":"https://codeload.github.com/excid3/esbuild-rails/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247685628,"owners_count":20979085,"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":["esbuild","hacktoberfest","hotwire","rails","rubyonrails","stimulusjs"],"created_at":"2024-09-24T13:11:51.257Z","updated_at":"2025-04-07T16:17:42.369Z","avatar_url":"https://github.com/excid3.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"[![npm version](https://badge.fury.io/js/esbuild-rails.svg)](https://badge.fury.io/js/esbuild-rails)\n\n# 🛤 esbuild-rails\n\nEsbuild Rails plugin for easy imports of Stimulus controllers, ActionCable channels, and other Javascript.\n\nThis package is designed to be used with [jsbundling-rails](https://github.com/rails/jsbundling-rails).\n\n## ⚙️ Installation\n\nInstall with npm or yarn\n\n```bash\nyarn add esbuild-rails\n```\n\n```bash\nnpm i esbuild-rails\n```\n\nCopy [`examples/esbuild.config.mjs`](examples/esbuild.config.mjs) to your git repository.\n\nUse npm to add it as the build script (requires npm `\u003e= 7.1`)\n\n```sh\nnpm pkg set scripts.build=\"node esbuild.config.js\"\n```\n\nor add it manually  in `package.json`\n\n```javascript\n\"scripts\": {\n  \"build\": \"node esbuild.config.mjs\"\n}\n```\n\n## 🧑‍💻 Usage\n\nImport a folder using globs:\n\n```javascript\nimport \"./src/**/*\"\n```\n\n#### Import Stimulus controllers and register them:\n\n```javascript\nimport { Application } from \"@hotwired/stimulus\"\nconst application = Application.start()\n\nimport controllers from \"./**/*_controller.js\"\ncontrollers.forEach((controller) =\u003e {\n  application.register(controller.name, controller.module.default)\n})\n```\n\n#### Importing Stimulus controllers from parent folders (ViewComponents, etc)\n\nTo import Stimulus controllers from parents in other locations, create an `index.js` in the folder that registers controllers and import the `index.js` location.\n\nFor example, we can import Stimulus controller for ViewComponents by creating an `app/components/index.js` file and importing that in your main Stimulus controllers index.\n\n```javascript\n// app/javascript/controllers/index.js\nimport { application } from \"./application\"\n\n// Import app/components/index.js\nimport \"../../components\"\n```\n\n```javascript\n// app/components/index.js\nimport { application } from \"../javascript/controllers/application\"\n\nimport controllers from \"./**/*_controller.js\"\ncontrollers.forEach((controller) =\u003e {\n  application.register(controller.name, controller.module.default)\n})\n```\n\n#### Import ActionCable channels:\n\n```javascript\nimport \"./channels/**/*_channel.js\"\n```\n\n#### jQuery with esbuild:\n\n```bash\nyarn add jquery\n```\n\n```javascript\n// app/javascript/jquery.js\nimport jquery from 'jquery';\nwindow.jQuery = jquery;\nwindow.$ = jquery;\n```\n\n```javascript\n//app/javascript/application.js\nimport \"./jquery\"\n```\n\nWhy does this work? `import` in Javascript is hoisted, meaning that `import` is run _before_ the other code regardless of where in the file they are. By splitting the jQuery setup into a separate `import`, we can guarantee that code runs first. Read more [here](https://exploringjs.com/es6/ch_modules.html#_imports-are-hoisted).\n\n#### jQuery UI with esbuild:\n\nFollow the jQuery steps above.\n\nDownload [jQuery UI custom build](https://jqueryui.com/download/) and add it to `app/javascript/jquery-ui.js`\n\n```javascript\nimport \"./jquery-ui\"\n\n$(function() {\n  $(document).tooltip()\n  $(\"#dialog\").dialog()\n})\n```\n\nA custom build is required because jQueryUI does not support ESM.\n\n## 🙏 Contributing\n\nIf you have an issue you'd like to submit, please do so using the issue tracker in GitHub. In order for us to help you in the best way possible, please be as detailed as you can.\n\n## 📝 License\n\nThe gem is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fexcid3%2Fesbuild-rails","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fexcid3%2Fesbuild-rails","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fexcid3%2Fesbuild-rails/lists"}