使用清单bower.json文件配置highstock-AngularJS

Question

我正在使用bower.json清单文件，以使其易于管理和安装软件包。 如何在bower.json文件中定义highstock.js和drilldown.js，并避免将其手动添加到index.html文件中？

Bower.json文件：

{
  "name": "myProj",
  "version": "0.0.14",
  "dependencies": {
    "json3": "~3.2.6",
    "es5-shim": "~2.1.0",
    "jquery": "2.1.1",
    "angular": "1.4.14",
    "bootstrap": "~3.3.5",
    "webFramework": "~0.0.78",
    "angular-sanitize": "~1.4.11",
    "angular-bootstrap": "~1.3.1",
    "angular-ui-router": "~0.2.15",
    "bootstrap-intel-theme": "~0.0.1",
    "ng-table": "~0.8.3",
    "angular-ui-grid": "~4.0.0",
    "highcharts-ng": "~0.0.13",
    "moment": "~2.13.0",
    "highcharts": "^5.0.0",
    "bootstrap-select": "^1.10.0",
    "angular-clipboard": "~1.4.0",
    "angular-messages": "~1.4.14",
    "angular-animate": "~1.4.14",
    "angular-resource": "~1.4.14",
    "angular-material": "^1.1.11",
    "angular-aria": "~1.4.14"

  },
  "devDependencies": {
    "angular-mocks": "~1.4.11"
  },
  "resolutions": {
    "moment": "~2.13.0",
    "angular-bootstrap": "~1.3.1",
    "bootstrap": "~3.3.5",
    "angular": "1.4.14",
    "angular-messages": "~1.4.14",
    "angular-animate": "~1.4.14",
    "angular-resource": "~1.4.14"
  },
  "overrides": {}
}

Answer 1

您可以这样安装highcharts软件包：

bower install highcharts

然后，您需要将其作为模块加载（ES6模块示例）：

import Highcharts from 'highcharts';

// Load the drilldown module.
import Drilldown from 'highcharts/modules/drilldown';

// Initialize drilldown module.
Drilldown(Highcharts);

文档：

• https://www.npmjs.com/package/highcharts#install-from-bower
• https://www.npmjs.com/package/highcharts#load-highcharts-as-an-es6-module