RobLoach / component-installer

Install Web Components through Composer
https://asset-packagist.org/
Other
280 stars 35 forks source link

how to set other configuration options / do remapping? #89

Closed X-Coder closed 9 years ago

X-Coder commented 9 years ago

Is there a way to set configuration require.js options like "map" or "paths"?

I'm trying to use cross-solution/bootstrap3-dialog with component-installer, but I have very same issue like described here: https://github.com/nakupanda/bootstrap3-dialog/issues/68, except that I can't figure out how I can modify require.conf.js the way described, to use "bootstrap-dialog" instead of "bootstrap3-dialog" because require.conf.js gets generated on the fly.

Don't know if I'm getting this right, but I think I only need to remap the package name from "bootstrap3-dialog" to "bootstrap-dialog" using the require.js "map", if there is no better solution.

The problem seems to be bootstrap3-dialog's AMD which defines "bootstrap-dialog" but has has a packagename of "bootstrap3-dialog".

My require:

require(['jquery','bootstrap3-dialog'], function($, BootstrapDialog){
   console.log(BootstrapDialog) // Error: Undefined
});

My shim in composer.json root currently looks like

"extra": {
        "component": {
            "cross-solution/bootstrap3-dialog": {
              "styles": [
                "dist/css/bootstrap-dialog.min.css"
              ],
              "scripts": [
                "dist/js/bootstrap-dialog.min.js"
              ],
              "files": [
                "dist/js/bootstrap-dialog.min.js",
                "dist/css/bootstrap-dialog.min.css",
                "dist/less/bootstrap-dialog.less"
              ],
              "shim": {
                "deps": ["jquery", "bootstrap"],
                "exports": "BootstrapDialog"
              }
            }
       }
 }
X-Coder commented 9 years ago

Just figured I can use the "name" property in my root's shim, to do the remapping :)

"extra": {
        "component": {
            "cross-solution/bootstrap3-dialog": {         
              "shim": {
                "name": "bootstrap-dialog",  //<--this
                "deps": ["jquery", "bootstrap"],
                "exports": "BootstrapDialog"
              }
        }
}