在 angular6 中使用 tone.js

Question

我正在尝试在 angular 中导入 tone.js 6. 如 tone.js 安装 doc 中所述，我安装了 tone.js.

npm - npm install tone

我尝试在 app.module.ts

中导入音调

import { ToneJs } from 'tone';
imports: [
   ToneJs,
   ...
]

我遇到了这个异常：

Error: Unexpected value 'undefined' imported by the module 'AppModule'

如何将 tone.js 导入并与 angular 一起使用？

这是我的angular版本

ng -v
Angular CLI: 6.0.1
Node: 8.11.1
OS: darwin x64
Angular: 6.0.1

编辑：

当我尝试在组件中加载它时

import { Component } from '@angular/core';
import { ToneJs } from 'tone';
@Component({
  selector: 'app-player',
  templateUrl: './player.component.html',
  styleUrls: ['./player.component.css']
})
export class PlayerComponent {  
    constructor(private toneJs: toneJs) { }
}

我得到：

Error: Can't resolve all parameters for PlayerComponent: (?).

Answer 1

如果您正在使用 angular-cli，您可以尝试将 ToneJS 库作为外部脚本添加到您的 angular.json

projects
- architect
  - build
    - scripts
      - [ ..., "node_modules/path/to/Tone.js"]

如果您在 src/typings.d.ts 没有 typings.d.ts 文件，请创建此文件并添加此行 declare var Tone: any;

现在，您应该可以使用 ToneJs 作为全局变量在整个应用程序中使用。所以你可以这样使用它：

import { Component } from '@angular/core';

@Component({
  selector: 'app-player',
  templateUrl: './player.component.html',
  styleUrls: ['./player.component.css']
})
export class PlayerComponent {  
    constructor() { 
        // const loop = new Tone.Loop((time) => { 
            // do something 
        }
    }
}

Answer 2

我今天早上在谷歌上搜索这个主题时发现了一个名叫 Dylan Lawrence created a nice starter 的人。超级有帮助！

在 angular6 中使用 tone.js

using tone.js within angular6

angular

tone.js