typescript - Angular and p5.js - p5.loadSound is not a function -


i have problem when want use p5.js in angular project.

i use angular cli. include p5.js in .angular-cli.json file:

"scripts": [       "../node_modules/p5/lib/p5.min.js",      "../node_modules/p5/lib/addons/p5.sound.js",      "../node_modules/p5/lib/addons/p5.dom.js"   ], 

then in component write:

import { component, oninit } '@angular/core';  import * p5 'p5';  @component({   selector: 'app-player',   templateurl: './player.component.html',   styleurls: ['./player.component.scss'] }) export class playercomponent implements oninit {    play: boolean = false;    constructor() { }    ngoninit() {     const s = (p) => {        let song;       let canvas;        p.preload = () => {         console.log('preload');         song = p.loadsound('assets/music/thunderstruck.mp3');       }        p.setup = () => {         canvas = p.createcanvas(595, 100);         canvas.parent('equalizer');         p.background(0);       }     }      let player = new p5(s);    }    onplay() {     this.play = !this.play;    }  } 

and when want load song , use loadsound(), js tells me error typeerror: p.loadsound not function

ok, js can't find method in file, in browser console can write this:

let song = p5.prototype.loadsound('assets/music/thunderstruck.mp3'); song.play(); 

and works (screenshot of console)!

i tried write in component:

song = p.prototype.loadsound('assets/music/thunderstruck.mp3'); 

it doesn't work.

what doing wrong?

replace

import * p5 'p5'; 

*

declare var p5: any; 

Comments

Popular posts from this blog

javascript - Create a stacked percentage column -

Optimising Firebase database by automatically overwriting data -

javascript - Angular UI-Grid customTemplate directive causing rows to load slowly/? -