我有一个完全用 JavaScript 构建的大型项目，我有一个有序且“内部模块化”的 5k 行 .js 文件，它是整个站点的引擎。
现在我必须创建另一个站点（这个站点的扩展），我必须在其中重复很多代码，我的问题是，我已经看到了使用 Browserify、CommonJS 等的很多可能性。但这不是我的在搜索中，我正在搜索模块化 JavaScript，就像 C/C++ 一样，使用函数或功能的文件制作#includes 并重用这样的代码。我已经这样做了，包括 HTML 中的其他 JS 文件，但是 JS 文件只是变量和一些数组，而不是网站的功能。
我也使用 jQuery，在那个大的 5k 行 .js 文件中，我几乎都在 jQuery document.ready 事件中，这也带来了麻烦，因为我必须为每个文件创建一个 document.ready 事件？
我需要一些指导
CommonJS 会让你require()模块，这是 NodeJS 模块系统的基础。Browserify 简化了这个在浏览器中使用的实现，甚至允许你需要 Node 模块（只要它们不依赖于二进制文件、文件系统和浏览器不支持的其他功能）。
var lib = require('someLibrary');
ECMAScript6（又名：ES6）为 javascript 带来了导入。虽然浏览器还不完全支持 ES6，但您可以使用Babel将 ES6 “转换”为 ES5。这个 ES5 将利用 CommonJS 来复制导入行为。
import { SomeClass, someFunction, someValue } from 'some/library';
在所有情况下，您的 javascript 都需要某种预处理才能将其转换为浏览器可以理解的 javscript。这通常意味着获取所有单独的源文件并将它们捆绑到一个缩小的捆绑文件中。这减少了浏览器必须发出的请求数量。
为了处理所有这些转译和捆绑，存在几个流行的构建系统，包括Grunt、Gulp和Webpack。Grunt 较旧且通常较慢，因为它是基于配置的设计。Gulp 更简单、更快，因为它依赖于 NodeJS 流。Webpack 是最新和最强大的，但以复杂性为代价。对于您希望做的事情，我建议您查看 Webpack，因为它不仅可以模块化您的 javascript，还可以模块化您的样式表和其他 Web 资产。
使用 webpack 打包你的代码http://webpack.github.io/docs/tutorials/getting-started/