Babel 所做的只是帮你把‘ES6 模块化语法’转化为‘CommonJS 模块化语法’，其中的require exports 等是 CommonJS 在具体实现中所提供的变量。
任何实现 CommonJS 规范的环境（如 node 环境）可以直接运行这样的代码，而浏览器环境并没有实现对 CommonJS 规范的支持，所以我们需要使用打包工具（bundler）来进行打包，说的直观一点就是把所有的模块组装起来，形成一个常规的 js 文件。
常用的打包工具包括 browserify webpack rollup 等。
楼上解释比较清楚了。我这里补充下：
楼主使用 Babel 的时候应该引入了 preset-es2015, 这是个转码插件集合，里面包含了 transform-es2015-modules-commonjs。所以模块转换出来是 CommonJS 标准。
Babel 的作用是帮助我们转换 ES6 代码为 ES5, 但是它没有模块管理的功能，浏览器端默认也无法识别 CommonJs 规范，这就需要我们额外使用模块打包工具，为我们的代码做一些包裹，让它能在浏览器端使用。 比如 Browserify, Webpack。
babel只是把es6转成commonjs，要webpack把commonjs转成amd，再提供个amd运行环境。
Babel 所做的只是帮你把‘ES6 模块化语法’转化为‘CommonJS 模块化语法’，其中的require exports 等是 CommonJS 在具体实现中所提供的变量。
任何实现 CommonJS 规范的环境（如 node 环境）可以直接运行这样的代码，而浏览器环境并没有实现对 CommonJS 规范的支持，所以我们需要使用打包工具（bundler）来进行打包，说的直观一点就是把所有的模块组装起来，形成一个常规的 js 文件。
常用的打包工具包括 browserify webpack rollup 等。
楼上解释比较清楚了。我这里补充下：
楼主使用 Babel 的时候应该引入了 preset-es2015, 这是个转码插件集合，里面包含了 transform-es2015-modules-commonjs。所以模块转换出来是 CommonJS 标准。
Babel 的作用是帮助我们转换 ES6 代码为 ES5, 但是它没有模块管理的功能，浏览器端默认也无法识别 CommonJs 规范，这就需要我们额外使用模块打包工具，为我们的代码做一些包裹，让它能在浏览器端使用。 比如 Browserify, Webpack。
babel只是把es6转成commonjs，要webpack把commonjs转成amd，再提供个amd运行环境。