在Angular中导入JS库

Question

我想在Angular项目中使用外部库。 这是从https://github.com/bramstein/fontfaceobserver

的文档如果您使用NPM，您可以安装字体外观作为观察员依赖：

$ npm install fontfaceobserver 
You can then require fontfaceobserver as a CommonJS (Browserify) module: 

var FontFaceObserver = require('fontfaceobserver'); 

var font = new FontFaceObserver('My Family'); 

font.load().then(function() { 
    console.log('My Family has loaded'); 
}); 

库使用require进口，但角度不一样，关键字。有没有一些标准的导入库的方法？

Answer 1

如果它的webpack你只能使用es6 import导入它。只要安装了它，这对我的作品：

import FontFaceObserver from 'fontfaceobserver'

this.font = new FontFaceObserver('ariel');

this.font是这样的：

this.font = { 
family:"ariel", 
stretch:"normal", 
style:"normal", 
weight:"normal" 
} 

Answer 2

这里是进口的组件的方式。

import FontFaceObserver from 'fontfaceobserver'; 

export class AppComponent { 

    public fontFace: any; 

    ngOnInit() { 
    this.fontFace = new FontFaceObserver('ariel'); 
    } 
}