{"action":"created","issue":{"url":"https://api.github.com/repos/jrburke/r.js/issues/808","labels_url":"https://api.github.com/repos/jrburke/r.js/issues/808/labels{/name}","comments_url":"https://api.github.com/repos/jrburke/r.js/issues/808/comments","events_url":"https://api.github.com/repos/jrburke/r.js/issues/808/events","html_url":"https://github.com/jrburke/r.js/issues/808","id":72662406,"number":808,"title":"Bad order in minified file when using babel/ES6 require.js plugin","user":{"login":"Rush","id":115926,"avatar_url":"https://avatars.githubusercontent.com/u/115926?v=3","gravatar_id":"","url":"https://api.github.com/users/Rush","html_url":"https://github.com/Rush","followers_url":"https://api.github.com/users/Rush/followers","following_url":"https://api.github.com/users/Rush/following{/other_user}","gists_url":"https://api.github.com/users/Rush/gists{/gist_id}","starred_url":"https://api.github.com/users/Rush/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Rush/subscriptions","organizations_url":"https://api.github.com/users/Rush/orgs","repos_url":"https://api.github.com/users/Rush/repos","events_url":"https://api.github.com/users/Rush/events{/privacy}","received_events_url":"https://api.github.com/users/Rush/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":2,"created_at":"2015-05-02T15:43:19Z","updated_at":"2015-05-02T17:12:17Z","closed_at":null,"body":"I am trying to use ES6 plugin for require.js via https://github.com/mikach/requirejs-babel but when using it, something breaks with the order of included plugins and require.js is no longer included as a first module as outlined below:\r\n```js\r\n{\r\n  dir: \"out\",\r\n  baseUrl: \"src\",\r\n  paths: {\r\n    \"requireLib\": \"require\"\r\n  },\r\n  modules: [\r\n    {\r\n      name: \"application\",\r\n      include: [\"requireLib\"]\r\n    }\r\n  ]\r\n}\r\n```\r\n\r\nPlease download my example to see what I am talking about:\r\n```\r\nwget http://x.rushbase.net/bd9739394d421a56193b26269885d96e4a18ce6b/rjs-bug.zip\r\nunzip rjs-bug.zip\r\ncd rjs-bug\r\nnode r.js -o build.js # to see bad output\r\n# Edit src/dep1.js and comment the require line to get good order output\r\nnode r.js -o build.js # to see good output\r\n```\r\n\r\nWhen not using the plugin the order is always good, as in `require.js` is always included first:\r\n```\r\napplication.js\r\n----------------\r\nrequire.js\r\ndep1.js\r\ndep2.js\r\napplication.js\r\n```\r\n\r\nWhen using the plugin from `src/dep1.js` the order is ALWAYS bad:\r\n```\r\napplication.js\r\n----------------\r\nbabel.js\r\nes6.js\r\nes6!es6dep\r\ndep1.js\r\ndep2.js\r\napplication.js\r\nrequire.js\r\n```\r\n\r\nFunnily enough, if we added some other module (not using the ES6 plugin), the order would be broken as well! Require.js would land at the end.\r\n\r\nI expect to always see `require.js` as first, as otherwise it doesn't work."},"comment":{"url":"https://api.github.com/repos/jrburke/r.js/issues/comments/98380513","html_url":"https://github.com/jrburke/r.js/issues/808#issuecomment-98380513","issue_url":"https://api.github.com/repos/jrburke/r.js/issues/808","id":98380513,"user":{"login":"jrburke","id":73359,"avatar_url":"https://avatars.githubusercontent.com/u/73359?v=3","gravatar_id":"","url":"https://api.github.com/users/jrburke","html_url":"https://github.com/jrburke","followers_url":"https://api.github.com/users/jrburke/followers","following_url":"https://api.github.com/users/jrburke/following{/other_user}","gists_url":"https://api.github.com/users/jrburke/gists{/gist_id}","starred_url":"https://api.github.com/users/jrburke/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/jrburke/subscriptions","organizations_url":"https://api.github.com/users/jrburke/orgs","repos_url":"https://api.github.com/users/jrburke/repos","events_url":"https://api.github.com/users/jrburke/events{/privacy}","received_events_url":"https://api.github.com/users/jrburke/received_events","type":"User","site_admin":false},"created_at":"2015-05-02T17:12:17Z","updated_at":"2015-05-02T17:12:17Z","body":"I did a pass through the debugger, and the main issue is that babel.js includes a `define.amd={}`. If r.js sees that, then it thinks the file is defining the AMD module API and hoists it to the top. r.js will take the first file it thinks defines the AMD API and hoist it. Since babel is parsed before requireLib, it wins the spot.\r\n\r\nSo @tbranyen's solution works around the issue by making sure requireLib is first, so that is a good way to go if you need a quick fix. Another solution might be to use onBuildRead and onBuildWrite hooks, in the onBuildRead hook, return an empty string for 'babel', but for the onBuildWrite, make sure it is the full babel contents. @tbranyen's is a simpler more declarative solution though, but it means likely renaming the output requireLib.js to your application.js after r.js runs, or allowing the HTML to load that built requireLib.js file instead of application.js.\r\n\r\nI don't know enough about babel and its internals to know why it might need to do the define definition. It also might be a nested, locally defined define and not the global define, so in an ideal world would not qualify as declaring an AMD API? I wouldn't mind someone else tracing that down though as I do not use babel.\r\n\r\nI could look at restricting the hoist detection code to try to only target define.amd calls for defines that are globally declared perhaps? Although that can also be tricky to test for possible variants, like `window.define`, `window['define']`, that sort of stuff. It would likely be a limited form of detection.\r\n\r\nI'll place this in the 2.1.18 bucket for more consideration, but probably needs more analysis of why babel is qualifying for hoisting here, and need to weigh the risks of possibly missing some AMD definitions by a stricter check."}}