4

我一直在开发一个新的 JavaScript 应用程序，它的大小正在迅速增长。

我的整个 JavaScript 应用程序被封装在一个函数中，在一个文件中，方式如下：

(function(){  
   var uniqueApplication = window.uniqueApplication = function(opts){
      if (opts.featureOne)
      {
         this.featureOne = new featureOne(opts.featureOne);
      }
      if (opts.featureTwo)
      {
         this.featureTwo = new featureTwo(opts.featureTwo);
      }
      if (opts.featureThree)
      {
         this.featureThree = new featureThree(opts.featureThree);
      }
   };

   var featureOne = function(options)
   {
       this.options = options;
   };
   featureOne.prototype.myFeatureBehavior = function()
   {
       //Lots of Behaviors
   };

   var featureTwo = function(options)
   {
       this.options = options;
   };
   featureTwo.prototype.myFeatureBehavior = function()
   {
       //Lots of Behaviors
   };

   var featureThree = function(options)
   {
       this.options = options;
   };
   featureThree.prototype.myFeatureBehavior = function()
   {
       //Lots of Behaviors
   };
})();

在匿名函数和执行之后的同一个文件中，我执行以下操作：

(function(){
   var instanceOfApplication = new uniqueApplication({
       featureOne:"dataSource",
       featureTwo:"drawingCanvas",
       featureThree:3540
   });
 })();

在在线上传这个软件之前，我将我的 JavaScript 文件及其所有依赖项传递到 Google Closure Compiler 中，只使用默认的压缩，然后我有一个很好的 JavaScript 文件准备上线用于生产。

这种技术对我来说非常有效——因为它只在 DOM 中创建了一个全局足迹，并为我提供了一个非常灵活的框架来扩展应用程序的每个附加功能。但是 - 我已经到了我真的不想将整个应用程序保存在一个 JavaScript 文件中的地步。

我想从在开发期间拥有一个大的 uniqueApplication.js 文件转变为为应用程序中的每个功能提供一个单独的文件，featureOne.js - featureTwo.js - featureThree.js

一旦我完成了离线开发测试，然后我想使用一些东西，也许是 Google Closure Compiler，将所有这些文件组合在一起 - 但是我希望这些文件都在该范围内编译，就像我拥有它们时一样在一个文件中 - 我也希望它们在离线测试期间保持在同一范围内。

我看到 Google Closure Compiler 支持传入模块的参数，但我还没有真正找到有关执行此类操作的大量信息。

任何人都知道如何实现这一点 - 或者对跨多个文件编写单个 JavaScript 库但仍然只在 DOM 上留下一个足迹的开发实践有任何建议？

4

3 回答 3

2

看看这个库是如何构建的
http://github.com/oyvindkinsey/easyXDM

这些文件是分开的，但合并在一起，放入一个闭包中，并由 ant 脚本 (build.xml)通过jslint运行。

ant 脚本还进行有条件的“编译”、字符串替换和缩小。

于 2010-05-26T21:41:00.270 回答
2

jQuery github的设置与您所说的类似。甚至还有一个使用 google 闭包编译器的Makefile/ ant 。build.xml

基本概念是在单独的文件中开发所有东西，然后使用cat（或类似的东西）将所有文件放在一起。

 cat intro.js core.js featureOne.js featureTwo.js featureThree.js outro.js > build/script.js

jQuery内部intro.js和outro.js来自jQuery的代码：

 // intro.js
 (function(window, undefined) {

 // outro.js
 })(window);
于 2010-05-26T21:43:11.123 回答
0

我建议您将代码库拆分为 AMD/RequireJS 样式的模块。

AMD 格式似乎可以满足您的大部分要求，并且正在迅速成为事实上的标准。

于 2011-03-10T13:26:43.587 回答