Angular 5 从 Angular-cli.json 加载 CDN 脚本标签

Question

我正在为项目使用 Angular 5。

我的 index.html 看起来像这样：-

<html lang="en">
<head>
    <meta charset="utf-8">
    <title>PDL Web</title>
    <link href="/assets/Images/favicon.ico" rel="shortcut icon" type="image/x-icon">
    <base id="baseHref" href="/">
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
    <app-root></app-root>
</body>
</html>
<script src="https://cdn.ckeditor.com/4.11.2/standard-all/ckeditor.js"></script>

我的问题是如何从angular-cli.json文件添加CDN资源的脚本标签？

求推荐。

Answer 1

您或许可以为此利用环境变量。

Angular CLI projects already use a production environment variable to enable production mode when in the production environment

It’s easy to add new environments in Angular CLI projects by adding new entries to the environments field in the .angular-cli.json file. That can then be initiated with ng build --env=dev:

"environments": {
  "dev": "environments/environment.ts",
  "prod": "environments/environment.prod.ts"
}

然后创建文件environment.prod.ts:

export const environment = {
  production: true,
  cdn: '/url/cdn.com'
};

然后在你的app-root中添加脚本标签html（不要忘记将环境导入你component.ts）：

<script src="{{environment.cdn}}"></script>

Angular 5 从 Angular-cli.json 加载 CDN 脚本标签

Angular 5 Load CDN script tag from Angular-cli.json

angular-cli

angular

angular5