对客户端和服务器端使用requireJs，Grunt.js和TypeScript进行合并和缩小

Question

我正在试图弄清楚我应该如何管理我的javascript文件，因为它现在真的很复杂而且它无法正常工作。 （我还没有使用requireJs但是我想）

有这种情况：

我正在构建一个Web应用程序（视频游戏），分为三个部分：

1. game-server - 包含数据库，使用pomelo.js框架。使用         打字稿。代码源不与浏览器/ Web服务器共享         份。

2. shared - 包含游戏和网络之间的共享代码和配置     服务器。使用TypeScript。

3. web-server - 包含路由，使用Express.js框架，TypeScript，包含使用Pixi框架，jQuery等的引擎。

目前有几个问题：

1. 我使用TypeScript编写代码，在OOP中，.ts文件在更改时由我的IDE在.js文件中自动转换。

2. 生成的.js用于浏览器。

3. 类.ts（或函数）由服务器在内部使用（如果在/共享中），并且可以从其他文件继承。

4. 服务器端正常。没有更多的问题。这意味着我可以使用TS文件，加载它们并从Node或其他TS文件中使用它们（带有TS的节点和require（）函数的module.exports或者预处理注释的类型） 使用Grunt可以使用dev / prod中的不同配置文件。生成合并然后缩小的文件：

   一个。康卡特 - http://pastebin.com/wajPVe1G

   湾Uglify - http://pastebin.com/E0EJ9VD6

   ℃。 Grunt脚本 - http://pastebin.com/GHMtReK4

   d。这个过程有点棘手，如果我使用requireJs，我可能会改变它！首先我运行concat所以我将创建几个.tmp.js文件然后我用它们.tmp.js创建几个.min.js，有时我直接生成.min.js。然后我在这些.min.js上使用uglify。

5. 客户端（浏览器）不行。

   一个。我必须按顺序加载我的脚本，因为一些脚本必须先包含在其他脚本中，比如jquery.js，pixi.js，init文件等等。我无法使用grunt加载它们，我没有找到如何。我创建了几个* .min.js文件，我从html标签中按顺序包含它们来解决它。

   湾我对TypeScript有一些麻烦

   1. Inheritance with TypeScript doesn't works browser side

   2. 我有继承，你可以看到，所以显然我需要大量控制文件的导入

   3. 某些文件使用module.exports或exports来导出类，但它在浏览器中不存在。这里唯一的解决方案是在加载文件之前在文件中添加全局export = {}。但它很棘手，因为我看到如果导出存在，PIXI会有不同的行为！如果它确实存在，那么它将其类放在exports var中，不创建全局PIXI var并在其他地方生成错误，因为PIXI不存在。所以我必须更改一些我没写的lib或者在创建全局导出var之前加载pixi.js。真无聊。

   4. 我需要使用Grunt / requireJs进行多次配置，因为我有几个页面有多个配置，脚本不应该全部包含在内。

我认为如何解决这些问题？

1. 不要使用concat，只使用uglify模块并生成一个 子目录如“js-built”并存储所有文件， uglified（minified）。
2. 使用requireJs按我想要的顺序导入这些文件并连接 他们只能在浏览器上加载一个文件。

你认为它可以解决我的问题吗？因为它太大了，我在这里看不到任何东西，我没有任何requireJs的经验，只使用Grunt三天所以......

如果你做过这类事情，请不要犹豫，分享你的经验，同时很难使用（和学习）所有节点模块。

谢谢。

PS：我只是意识到TypeScript需要以两种不同的模式进行编译才能在浏览器和服务器上运行......另一个问题^^