使用Angular-CLI正确配置脚本

Question

假设我有一个使用这些JS库的项目：

必须在所有页面中加载的
• main.js
• joe.js这是一个要在所有页面中加载的npm包
• bob.js这是一个旧式的第三方JS库，没有定义任何模块加载到所有页面
• max.js这是一个在某些组件中按需加载的CommonJS库

到目前为止，我成功了：

• 在main.js
的scripts属性中加入angular-cli.json
• 与joe.js使用相对路径（../node_modules/joe/dist/joe.js）
相同

因此它们最终会出现在每个页面上加载的生成包中。

与其他两个相比，我遇到了很多问题。到目前为止，我已经设法通过将bob.js包含在一个自动执行的函数中来包含(function() { // old code of bob.js })(); ：

max.js

但为什么？ 我对如何包含/捆绑SELECT tyi.TestType, COUNT(tr.TestID) AS NoOfTest, sum(Fee) as TotalAmount, FROM TestTypeInfo AS tyi LEFT OUTER JOIN TestInfo AS ti ON tyi.TestTypeId=ti.TestTypeId LEFT OUTER JOIN TestRequest tr ON ti.TestId=tr.TestId WHERE EntryDate BETWEEN '2016-12-31' AND '2016-12-31' OR EntryDate IS NULL GROUP BY tyi.TestType ...

完全不了解

Answer 1

对于main, joe and bob.js，你应该这样做：

要让脚本随处可用，您可以使用angular-cli文件夹结构中的src/assets文件夹。

然后将脚本包含在：

中

<script src="assets/my-script.js"></script>

作为一个选项，您可以使用webpack从node_modules到src/assets获取这些依赖项。

对于大多数使用CDN的情况，选择比这更好。

对于max.js，我会创建一个服务来方便地注入它：

import { Injectable } from '@angular/core';

@Injectable()
export class MaxService {

 lib: any;
 constructor(){
  this.lib = require('max.js');
 }

}