携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第5天，点击查看活动详情
如何的去实现代码的拆分
我们该究竟如何的解决代码的拆分问题呢？我们先感谢一下 Node.js，它使 JavaScript 模块诞生了。
我们知道 Node.js 是一个 JavaScript 的运行环境，我们可以在浏览器环境之外的计算机或者是服务器上使用它，Webpack 其实就是运行在 Node.js 中。
当 Node.js 发布的时候，一个新的时代就开始了，它带来了新的挑战。那我们想一下，既然我们不是在浏览器中运行 JavaScript。现在就没有了可以添加到我们浏览器中的 HTML 文件以及我们编写的 script 标签。
那么 Node.js 是如何的去加载新的代码文件呢？commonjs 的问世，引入了一个 require 的机制，它允许在我们当前的文件中去加载和使用某个模块，导入需要的每个模块。这个开箱即用的功能帮助我们解决了代码的拆分问题。
打开 VS Code 编辑器，我们在当前目录下面的新建一个 commonjs 文件夹，在这个文件夹下面创建一个 math.js 文件，我们可以把 math.js 文件称作是一个模块。
在 math.js 文件中编写两个方法，一个是求和方法 add，一个是求差方法 minus。
const add=(x,y)=>{
return x+y;
}
const minus=(x,y)=>{
return x-y;
}
module.exports = {
add,
minus
}
那么这两个方法我们该如何的当成是一个模块来暴露呢？那我们可以使用 commonJS 给我们提供的 module.exports，给它复制一个扁平的对象，在这个对象里边我们把 add 以及 minus 方法给暴露出去。
注意：这里边的 add 方法 和 minus 定义的箭头函数，以及 const 定义常量，以及暴露的方法，使用的是 ES6 的语法。
在 commonjs 下新建 server.js 文件，在该文件中调用 math.js 模块中的方式。如何在一个 JS 文件里去引用另外一个模块呢？commonjs 就给我们提供了一个 require 方法，这个方法做到开箱即用，需要加载当前目录下面定义的 math.js 文件，这样 math.js 模块就被引进来。
const math=require("./math.js")
console.log(math.add(2,4))
这个 math 对象指向了我们 math.js 中的 module.exports 暴露的扁平对象。
这个方法我们该如何的去运行呢？我们知道 Node.js 的代码是不能在浏览器上运行的，我们只能在 Node.js 的环境中运行。
需要在 server.js 文件所在的文件夹中使用 node 命令运用 server.js。
可以看到 VS Code 控制台输出的结果：6。我们指通过 math.add 方法就可以实现求和功能，也就是我们实现了模块化。
现在 Node.js 俨然已经成为一种语言、一个平台，乃至快速开发和创建应用的一种方式了，它接管了我们整个 JavaScript 世界。
通过刚才的例子看到，虽然 commonjs 是 Node.js 项目的绝佳模块拆分的解决方案，但是浏览器是不支持这个模块化的。
在 index-5.html 文件中通过 script 标签引入 commonjs 下的 server.js。
<script src="./commonjs/server.js"></script>
在浏览器访问，可以看到控制台输出“ require is not defined”错误信息。
我们在 node.js 开箱即用的 require 加载模块的方法，在浏览器上失效了。我们该如何的解决这个问题呢？
