Global scripts

全局腳本

You can add Javascript files to the global scope via the scripts option inside your
project's build target options in angular.json.
These will be loaded exactly as if you had added them in a <script> tag inside index.html.
您可以通過angular.json中項目的構建目標選項中的 腳本 選項將JavaScript文件添加到全局范圍。這些將被加載，就像您將它們添加到 index.html 中的 <script> 標記中一樣。
This is especially useful for legacy libraries or analytic snippets.
這對舊版庫或分析片段尤其有用。

"architect": {
  "build": {
    "builder": "@angular-devkit/build-angular:browser",
    "options": {
      "scripts": [
        "src/global-script.js",
      ],

You can also rename the output and lazy load it by using the object format:
您也可以使用對象格式重命名輸出并延遲加載它：

"scripts": [
  "src/global-script.js",
  { "input": "src/lazy-script.js", "lazy": true },
  { "input": "src/pre-rename-script.js", "bundleName": "renamed-script" },
],

Note: you will also need to add any scripts to the test builder if you need them for unit tests.
注意：如果需要它們進行單元測試，您還需要將任何腳本添加到測試生成器。

Using global libraries inside your app

在應用程序內使用全局庫

Once you import a library via the scripts array, you should not import it via a import statement
in your TypeScript code (e.g. import * as $ from 'jquery';).
If you do that you'll end up with two different copies of the library: one imported as a
global library, and one imported as a module.
一旦通過腳本數組導入庫，您不應該通過TypeScript代碼中的import語句導入它（例如， import * as $ from 'jquery'）

This is especially bad for libraries with plugins, like JQuery, because each copy will have
different plugins.
對于帶有插件的庫如JQuery來說，這是非常糟糕的，因為每個副本都會有不同的插件。

Instead, download typings for your library (npm install @types/jquery) and follow
the 3rd Party Library Installation steps,
this will give you access to the global variables exposed by that library.
相反，為你的庫下載類型 (npm install @types/jquery) 和 根據 3rd Party Library Installation 步驟, 這將使您可以訪問該庫公開的全局變量，

If the global library you need to use does not have global typings, you can also declare them
manually in src/typings.d.ts as any:
如果您需要使用的全局庫沒有全局類型，您也可以在 src / typings.d.ts 中手動聲明它們，如下所示：

declare var libraryName: any;

When working with scripts that extend other libraries, for instance with JQuery plugins
(e.g, $('.test').myPlugin();), since the installed @types/jquery may not include myPlugin,
you would need to add an interface like the one below in src/typings.d.ts.
處理擴展其他庫的腳本時，例如使用JQuery插件(e.g, $('.test').myPlugin();), 自安裝@types/jquery 可能不包含 myPlugin, 您需要在 src/typings.d.ts 中添加如下所示的端口。

interface JQuery {
  myPlugin(options?: any): any;
}

Otherwise you may see [TS][Error] Property 'myPlugin' does not exist on type 'JQuery'. in your IDE.
否則，你可能會看到 [TS][Error] Property 'myPlugin' does not exist on type 'JQuery'. 在你的IDE.