sanjihan
sanjihan

Reputation: 6026

import JS library in Angular

I am trying to use an external library in an Angular project. This is from the docs of https://github.com/bramstein/fontfaceobserver

If you're using npm you can install Font Face Observer as a dependency:

$ 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');
});

Library is imported using a require, but angular doesn't like that keyword. Is there some standard way of importing a library?

Upvotes: 4

Views: 1743

Answers (2)

Rajkeshwar Prasad
Rajkeshwar Prasad

Reputation: 899

Here is the way of importing in component.

import FontFaceObserver from 'fontfaceobserver';

export class AppComponent {

  public fontFace: any;

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

Upvotes: 2

rtn
rtn

Reputation: 2034

If its webpack you should just be able to import it using es6 imports. Just installed it and this works for me:

import FontFaceObserver from 'fontfaceobserver'

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

this.font look like this:

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

Upvotes: 6

Related Questions