Developing a web project in JavaScript ES6, I currently use Traceur to pile my modules from ES6 to ES5, thinking that in the future, when browser will support ES6, I would be able to skip that transpilation step.
In the end, because I don't want to download several js pieces at start up, I have a single file that contains all my modules converted into ES5, thanks to Traceur.
But to validate this choice, I was wondering if this could still be possible the day I would keep the source in ES6. If I simply concatenate them, there will be invalid imports and name conflicts.
It looks like it has not been designed for it and it would require a extra processing step to merge them correctly.
How are we suppose to handle ES6 single file project defined with several modules ?
Developing a web project in JavaScript ES6, I currently use Traceur to pile my modules from ES6 to ES5, thinking that in the future, when browser will support ES6, I would be able to skip that transpilation step.
In the end, because I don't want to download several js pieces at start up, I have a single file that contains all my modules converted into ES5, thanks to Traceur.
But to validate this choice, I was wondering if this could still be possible the day I would keep the source in ES6. If I simply concatenate them, there will be invalid imports and name conflicts.
It looks like it has not been designed for it and it would require a extra processing step to merge them correctly.
How are we suppose to handle ES6 single file project defined with several modules ?
Share Improve this question edited Dec 7, 2014 at 17:31 ProgramFOX 6,40011 gold badges48 silver badges54 bronze badges asked Nov 6, 2014 at 23:50 JBEJBE 12.6k7 gold badges51 silver badges52 bronze badges 1- possible duplicate of How do I concatenate ES6 modules?, see also Concatenate imports in modules in babeljs – Bergi Commented Aug 8, 2015 at 18:15
3 Answers
Reset to default 3This will be solved by bundling, as described here: http://www.2ality./2013/11/es6-modules-browsers.html in chapter 3. So this is possible and validate your approach, although I couldn't find an implementation of the corresponding pilation step on the web, but it should arise when people start using ES6 modules.
In the near future, there won't be anymore the need to build single file project thanks to HTTP/2.
See: Why bundle optimizations are no longer a concern in HTTP/2
The best solution is probably going to be to use browserify to bundle your transpiled code into one file. Then I'd use uglify or Google's Closure Compiler to minify the file, given there is a slight size overhead given all the imports/exports that have to be dealt with.
Also, if you're willing to use Babel instead of Traceur, there's a Babel plugin for browserify to make things really easy.