Browserify 导入/需要？答案

【问题标题】：Browserify import/require?Browserify 导入/需要？
【发布时间】：2015-10-09 16:13:36
【问题描述】：

我正在尝试使用 browserify，并且已经通过了许多示例。

在一个示例中，我看到了“导入”的用法：

import 'jquery';

并使用以下命令导入本地文件：

import Header from './Header';

但在其他示例中，我看到人们通过以下方式导入：

require('./Header');

有什么区别？

【问题讨论】：

【解决方案1】：

require() 是 ES5 中的 Node 模块系统（CommonJS）。 import 是 ES6 模块语法。

如果你想对使用 ES6 模块语法编写的模块进行浏览化处理，你需要使用类似 babelify（或其他方式的 babel）来编译它们。

【讨论】：

不确定我是否理解。如果我通过 Babel 转译 ES6，为什么我需要 browserify（或 require）？这不是将 import 语句翻译成旧 JS 环境可以理解的内容吗？
@Matthias pre-ES6 没有原生模块系统，因此有多个系统在用户代码中构建（例如 CommonJS / Node 模块和 AMD）。 require() 是 Node 模块 API 的一部分。所以这是你可以编译到的“旧 JS 环境理解的东西”目标之一（它将在 Node 中运行）。但是，浏览器不知道这些 API。 Node通过将模块包装在注入require()等的函数中来实现它。在浏览器中require()只是一个引用错误。 Browserify 使其在浏览器中工作，并将整个依赖图捆绑到单个脚本中。
知道了。感谢您的澄清！
@Matthias 没问题！
如果有人发布了一个关于如何同时使用 browserify 和 babel 的示例或链接，那就太好了。