使用组件作为 NPM 包 Angular6

Use a Component as NPM Package Angular6

我是 Angular6 的初学者。我尝试使用 Angular5-Csv 下载 CSV 文件。

所以我使用了以下语句:

安装:

>  npm install --save angular5-csv

然后我导入了上面的:

> import { Angular5Csv } from 'angular5-csv/dist/Angular5-csv';

*

The components using Angular5-csv is pointing to /dist folder instead of an npm package. I want to add as an npm package. Any one can help me please.

*

我想它的导入是

import { Angular5Csv } from 'angular5-csv/Angular5-csv' 

来自关注 link“https://www.npmjs.com/package/angular5-csv”。对吗?

看来您使用的 angular 包自 npmjs page 创建以来已经更新,但描述尚未更新。

话虽如此

import { Angular5Csv } from 'angular5-csv/dist/Angular5-csv';

指向一个包,但是它指向包内名为 dist 的子文件夹。

或者,我还在那个 npmjs 页面上注意到 github 链接到名称略有不同但似乎具有相同功能的内容。

因此,如果在导入名称中没有 dist 真的很重要,您可以改为:

npm install --save angular-csv-ext

然后使用以下导入:

import { AngularCsv } from 'angular-csv-ext/Angular-csv';

这是我的组件在加载时导出 CSV 数据的示例:

import { Component, OnInit } from '@angular/core';
import { AngularCsv } from 'angular-csv-ext/Angular-csv';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  ngOnInit(): void 
  {
    var data = [
      {
        name: "Test 1",
        age: 13,
        average: 8.2,
        approved: true,
        description: "using 'Content here, content here' "
      },
      {
        name: 'Test 2',
        age: 11,
        average: 8.2,
        approved: true,
        description: "using 'Content here, content here' "
      },
      {
        name: 'Test 4',
        age: 10,
        average: 8.2,
        approved: true,
        description: "using 'Content here, content here' "
      },
    ];
    new AngularCsv(data, 'My Report');
  }
  title = 'test';

}