将 javascript 文件添加到 Angular7 dist 文件夹答案

【问题标题】：Adding a javascript file to Angular7 dist folder将 javascript 文件添加到 Angular7 dist 文件夹
【发布时间】：2019-06-26 00:47:47
【问题描述】：

我正在 Angular7 中构建一个应用程序，它已准备就绪，但我需要创建一个普通的 javascript（希望可以缩小）以包含在将使用主要 Angular 应用程序的网站中。当用户单击按钮或链接时，此脚本会将应用程序嵌入到 iframe 中。我想要的是将该脚本和 Angular 应用程序作为同一个包的一部分，但不包含在 Angular 应用程序中。仅可用于控制主机网站可以做什么来嵌入我们的主应用程序。如果有其他方法可以解决此问题，我将不胜感激

【问题讨论】：

标签： javascript angular web-applications

【解决方案1】：

创建自定义 js 文件

exports.myFunction = function myFunction() {
    alert('External custom js');
}

将此 JavaScript 文件添加到 angular.json 文件的脚本数组中。

"scripts": [
  .....
  "src/assets/js/custom.js"
]

如果你的js文件中有myFunction函数，你可以在组件中声明

import {myFunction} from '../assets/js/custom.js';

我为 custom.js 做了一个演示

https://stackblitz.com/edit/angular-custom-js?file=src/app/app.component.ts

【讨论】：

是的，但这包括 index.html 中的文件。我怎样才能做到与此完全相同但不包含在 index.html 中？谢谢
不需要在index.html中添加，可以在组件中使用
我的意思是，当您将此脚本添加到 angular.json 时，编译器会将
你想在 index.html 中使用自定义 js 吗？
我想要的是有一个“vanilla javascript”文件，但不包含在 index.html 中，因为我想使用来自任何其他想要使用我的主要 Angular 应用程序的网站的该文件，但是这个脚本只做一个小任务：在 iframe 中打开 anular 应用程序