{"id":16186837,"url":"https://github.com/robloach/component-installer","last_synced_at":"2025-05-16T06:05:12.655Z","repository":{"id":7103839,"uuid":"8396302","full_name":"RobLoach/component-installer","owner":"RobLoach","description":"Install Web Components through Composer","archived":false,"fork":false,"pushed_at":"2020-05-06T08:37:24.000Z","size":303,"stargazers_count":279,"open_issues_count":30,"forks_count":33,"subscribers_count":20,"default_branch":"master","last_synced_at":"2025-04-01T14:14:27.266Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://asset-packagist.org/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/RobLoach.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2013-02-24T20:34:49.000Z","updated_at":"2025-03-15T20:58:38.000Z","dependencies_parsed_at":"2022-09-05T17:11:47.475Z","dependency_job_id":null,"html_url":"https://github.com/RobLoach/component-installer","commit_stats":null,"previous_names":[],"tags_count":23,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RobLoach%2Fcomponent-installer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RobLoach%2Fcomponent-installer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RobLoach%2Fcomponent-installer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RobLoach%2Fcomponent-installer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/RobLoach","download_url":"https://codeload.github.com/RobLoach/component-installer/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247878015,"owners_count":21011158,"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-10-10T07:19:42.672Z","updated_at":"2025-04-08T16:01:43.516Z","avatar_url":"https://github.com/RobLoach.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# DEPRECATED\n\nComponent Installer has been deprecated. Use one of the following projects instead:\n- [Composer Installers Extender](https://github.com/oomphinc/composer-installers-extender)\n- [Asset Packagist](https://asset-packagist.org)\n- [Composer Asset Plugin](https://github.com/fxpio/composer-asset-plugin)\n- [Laravel Mix](https://laravel.com/docs/5.8/mix) (Example: [eventum/eventum#801](https://github.com/eventum/eventum/pull/801) and  [eventum/eventum#812](https://github.com/eventum/eventum/pull/812))\n\n## Example\n\n```\ncomposer require oomphinc/composer-installers-extender\n```\n\n```\n  \"extra\": {\n    \"installer-types\": [\"component\"],\n    \"installer-paths\": {\n      \"components/{$name}/\": [\"type:component\"]\n    }\n  }\n```\n\n# Component Installer for [Composer](http://getcomposer.org) [![Build Status](https://secure.travis-ci.org/RobLoach/component-installer.png?branch=master)](http://travis-ci.org/RobLoach/component-installer)\n\nAllows installation of Components via [Composer](http://getcomposer.org).\n\n## Install\n\n```\ncomposer require robloach/component-installer\n```\n\n``` json\n{\n    \"require\": {\n        \"robloach/component-installer\": \"*\"\n    }\n}\n```\n\n## Usage\n\nTo install a Component with Composer, add the Component to your *composer.json*\n`require` key. The following will install [jQuery](http://jquery.com) and\n[normalize.css](https://github.com/necolas/normalize.css):\n\n```\ncomposer require components/jquery\ncomposer require components/normalize.css\n```\n\n``` json\n{\n    \"require\": {\n        \"components/jquery\": \"2.*\",\n        \"components/normalize.css\": \"3.*\",\n        \"robloach/component-installer\": \"*\"\n    }\n}\n```\n\n### Using the Component\n\nThe easiest approach is to use the Component statically. Just reference the\nComponents manually using a `script` or `link` tag:\n\n``` html\n\u003cscript src=\"components/jquery/jquery.js\"\u003e\u003c/script\u003e\n\u003clink href=\"components/normalize/normalize.css\" rel=\"stylesheet\"\u003e\n```\n\nFor complex projects, a [RequireJS](http://requirejs.org) configuration is\navailable, which allows autoloading scripts only when needed. A *require.css*\nfile is also compiled, including all Component stylesheets:\n\n``` html\n\u003c!DOCTYPE html\u003e\n\u003chtml\u003e\n    \u003chead\u003e\n        \u003clink href=\"components/require.css\" rel=\"stylesheet\" type=\"text/css\"\u003e\n        \u003cscript src=\"components/require.js\"\u003e\u003c/script\u003e\n    \u003c/head\u003e\n    \u003cbody\u003e\n        \u003ch1\u003ejQuery+RequireJS Component Installer Sample Page\u003c/h1\u003e\n        \u003cscript\u003e\n          require(['jquery'], function($) {\n            $('body').css('background-color', 'green');\n          });\n        \u003c/script\u003e\n    \u003c/body\u003e\n\u003c/html\u003e\n```\n\n## Configuration\n\nThere are a number of ways to alter how Components are installed and used.\n\n### Installation Directory\n\nIt is possible to switch where Components are installed by changing the\n`component-dir` option in your root *composer.json*'s `config`. The following\nwill install jQuery to *public/jquery* rather than *components/jquery*:\n\n``` json\n{\n    \"require\": {\n        \"components/jquery\": \"*\"\n    },\n    \"config\": {\n        \"component-dir\": \"public\"\n    }\n}\n```\n\nDefaults to `components`.\n\n### Base URL\n\nWhile `component-dir` depicts where the Components will be installed,\n`component-baseurl` tells RequireJS the base path that will use when attempting\nto load the scripts in the web browser. It is important to make sure the\n`component-baseurl` points to the `component-dir` when loaded externally. See\nmore about [`baseUrl`](http://requirejs.org/docs/api.html#config-baseUrl) in the\nRequireJS documentation.\n\n``` json\n{\n    \"require\": {\n        \"components/jquery\": \"*\"\n    },\n    \"config\": {\n        \"component-dir\": \"public/assets\",\n        \"component-baseurl\": \"/assets\"\n    }\n}\n```\n\nDefaults to `components`.\n\n### Assetic filters\n\n``` json\n{\n    \"require\": {\n        \"components/jquery\": \"*\"\n    },\n    \"config\": {\n        \"component-dir\": \"public/assets\",\n        \"component-baseurl\": \"/assets\",\n        \"component-scriptFilters\": {\n            \"\\\\Assetic\\\\Filter\\\\GoogleClosure\\\\CompilerApiFilter\": []\n        },\n        \"component-styleFilters\": {\n            \"\\\\Assetic\\\\Filter\\\\CssImportFilter\": []\n        }\n    }\n}\n```\n\n## Creating a Component\n\nTo set up a Component to be installed with Component Installer, have it\n`require` the package *robloach/component-installer* and set the `type` to\n*component*, but it is not necessary:\n\n``` json\n{\n    \"name\": \"components/bootstrap\",\n    \"type\": \"component\",\n    \"require\": {\n        \"robloach/component-installer\": \"*\"\n    },\n    \"extra\": {\n        \"component\": {\n            \"scripts\": [\n                \"js/bootstrap.js\"\n            ],\n            \"styles\": [\n                \"css/bootstrap.css\"\n            ],\n            \"files\": [\n                \"img/*.png\",\n                \"js/bootstrap.min.js\",\n                \"css/bootstrap.min.css\"\n            ]\n        }\n    }\n}\n```\n\n* `scripts` - List of all the JavaScript files that will be concatenated\ntogether and processed when loading the Component.\n* `styles` - List of all the CSS files that should be concatenated together\ninto the final *require.css* file.\n* `files` - Any additional file assets that should be copied into the Component\ndirectory.\n\n### Component Name\n\nComponents can provide their own Component name. The following will install\njQuery to *components/myownjquery* rather than *components/jquery*:\n\n``` json\n{\n    \"name\": \"components/jquery\",\n    \"type\": \"component\",\n    \"extra\": {\n        \"component\": {\n            \"name\": \"myownjquery\"\n        }\n    }\n}\n```\n\nDefaults to the package name, without the vendor.\n\n### RequireJS Configuration\n\nComponents can alter how [RequireJS](http://requirejs.org) registers and\ninteracts with them by changing some of the [configuration\noptions](http://www.requirejs.org/docs/api.html#config):\n\n``` json\n{\n    \"name\": \"components/backbone\",\n    \"type\": \"component\",\n    \"require\": {\n        \"components/underscore\": \"*\"\n    },\n    \"extra\": {\n        \"component\": {\n            \"shim\": {\n                \"deps\": [\"underscore\", \"jquery\"],\n                \"exports\": \"Backbone\"\n            },\n            \"config\": {\n                \"color\": \"blue\"\n            }\n        }\n    },\n    \"config\": {\n        \"component\": {\n            \"waitSeconds\": 5\n        }\n    }\n}\n```\n\nCurrent available RequireJS options for individual packages include:\n* [`shim`](http://www.requirejs.org/docs/api.html#config-shim)\n* [`config`](http://www.requirejs.org/docs/api.html#config-moduleconfig)\n* Anything that's passed through `config.component` is sent to Require.js\n\n### Packages Without Composer Support\n\nUsing [`repositories`](http://getcomposer.org/doc/05-repositories.md#repositories)\nin *composer.json* allows use of Component Installer in packages that don't\nexplicitly provide their own *composer.json*. In the following example, we\ndefine use of [html5shiv](https://github.com/aFarkas/html5shiv):\n\n``` json\n{\n    \"require\": {\n        \"afarkas/html5shiv\": \"3.6.*\"\n    },\n    \"repositories\": [\n        {\n            \"type\": \"package\",\n            \"package\": {\n                \"name\": \"afarkas/html5shiv\",\n                \"type\": \"component\",\n                \"version\": \"3.6.2\",\n                \"dist\": {\n                    \"url\": \"https://github.com/aFarkas/html5shiv/archive/3.6.2.zip\",\n                    \"type\": \"zip\"\n                },\n                \"source\": {\n                    \"url\": \"https://github.com/aFarkas/html5shiv.git\",\n                    \"type\": \"git\",\n                    \"reference\": \"3.6.2\"\n                },\n                \"extra\": {\n                    \"component\": {\n                        \"scripts\": [\n                            \"dist/html5shiv.js\"\n                        ]\n                    }\n                },\n                \"require\": {\n                    \"robloach/component-installer\": \"*\"\n                }\n            }\n        }\n    ]\n}\n```\n\n### Packages Without Component Support In *composer.json*\n\nUsing [`extra`](https://getcomposer.org/doc/04-schema.md#extra)\nin *composer.json* allows use of Component Installer in packages that don't\nexplicitly provide support for component, but do ship with their own *composer.json*. \nUsing `extra` with packages that ship with Component Installer, will override component's settings for that package.\n\n``` json\n{\n    \"require\": {\n        \"datatables/datatables\": \"~1.10\"\n    },\n    \"extra\": {\n        \"component\": {\n            \"datatables/datatables\": {\n                \"scripts\": [\n                    \"media/js/jquery.dataTables.js\"\n                ],\n                \"styles\": [\n                    \"media/css/jquery.dataTables.css\"\n                ],\n                \"files\": [\n                    \"media/js/jquery.dataTables.min.js\",\n                    \"media/css/jquery.dataTables.min.css\",\n                    \"media/images/*.png\"\n                ]\n            }\n        }\n    }\n}\n```\n\n## Not Invented Here\n\nThere are many other amazing projects from which Component Installer was\ninspired. It is encouraged to take a look at some of the [other great package\nmanagement systems](http://github.com/wilmoore/frontend-packagers):\n* [npm](http://npmjs.org)\n* [bower](http://bower.io/)\n* [component](http://github.com/component/component)\n* [Jam](http://jamjs.org)\n* [volo](http://volojs.org)\n* [Ender](http://ender.jit.su)\n* etc\n\n## License\n\nComponent Installer is licensed under the MIT License - see LICENSE.md for\ndetails.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frobloach%2Fcomponent-installer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frobloach%2Fcomponent-installer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frobloach%2Fcomponent-installer/lists"}