请教,用ES6写的modules改如何合并成一份js?

为了学习ES6,最近用把之前写的一个工具(github地址)翻译成了6,用得是babel。目录结构大致如下

--src
    --core
        -- xxx.js
        -- xxx.js
    --model
        -- xxx.js
        -- xxx.js
    --extend
        -- xxx.js
        -- xxx.js

es5的时候是使用grunt把所有的文件都合并成压缩成了一个xxx.min.js(等于是全部js文本叠加起来,成为全局函数和全局变量,可以相互访问得到,再在外层加一层闭包以免污染,并使其支持AMD和CMD规范), 以供具体的外部项目来使用。
那么现在问题来了,这个工具迁移到es6中所有的依赖都是使用 import / export来处理的,我希望最终也能跟过去一样,最终生成一份供外部调用的js文件,这该如何操作? 有没有相应的工具? 如果有这样的工具,是不是也是babel先转es5,再合并这样的方案?

还是说es6时代了,合并这种思想已经过时? 有新的思路可以借鉴? 刚接触es6没多久,希望大家指点一二,万分感谢!

阅读 7.9k
4 个回答

大家回答最好具体一些。。。就好比我问 “去南京路怎么走” ,有的回答我 “公交” ,有的回答我 “地铁” 一样。

最后使用 Webpack + babel-loader实现了要求。

参考链接
babel-loader
webpack

楼主可以参考一下我写的这个gulpfile,可以ES6打包编译。使用的是gulp + babelify + browserify:https://github.com/livoras/feb/blob/master/gulpfile.babel.js

其实关于打包合并的就是这几行:

  // Build scripts
  gulp.src(src.scripts)
    .pipe(browserify({
      debug: true,
      transform: ["babelify", "brfs"]
    }))
    .pipe(uglify())
    .pipe(gulp.dest(dist.scripts))

可以使用webpack来构建你的项目

webpack 或者 broswerify

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题