javascript - 如何将 Javascript 库添加到 Angular 4 组件？

Question

我正在尝试弄清楚如何将 JavaScript 文件仅导入特定组件。

我将以下代码直接放入我的组件中:

import "../../vendor/datatables/js/jquery.dataTables.min.js";
import "../../vendor/datatables-plugins/dataTables.bootstrap.min.js";
import "../../vendor/datatables-responsive/dataTables.responsive.js";

但它会引发一个错误:

Module not found: Error: Can't resolve 'jquery' in...

这让我怀疑依赖于 jQuery 的文件无法在此范围内找到 jQuery 库。

jQuery 本身放在 angular-cli.json 文件中:

"scripts": [
    "./vendor/jquery/jquery.min.js"
],

另一种方法是将所有这 3 个外部 JS 文件也放入 angular-cli.json 文件中，它会起作用，从用户的 Angular 显示预期的结果。

但我想弄清楚如何避免为那些只在少数特定组件中使用的 JS 全局设置。

谢谢，请指教。

Answer 1

例如，要将 jQuery 导入到您的组件中，您应该这样写:

import * as $ from 'jquery';

这意味着“从“jQuery”中导入所有并用作“$””。

如果你自己下载了这个库，没有npm install，你可以试试下面的方法(但我不确定它是否有效):

import * as $ from 'path/to/jquery';