angular库-如何阻止已发布的npm包导出精简的组件和模块名称

Question

我按照这个guide here创建了一个angular库，并成功地将它发布到了gitlab包注册表中。

我可以毫无问题地安装这个包，但是我无法导入我的库模块。在node_modules中，我能够看到所有的模块名称都被缩小了。

/**
 * Generated bundle index. Do not edit.
 */
export * from './index';
export { ScrapTypeTimeSeriesChartComponent as ɵf } from './lib/components/scrap-type-time-series-chart/scrap-type-time-series-chart.component';
export { ScrapTypeTimeSeriesChartModule as ɵe } from './lib/components/scrap-type-time-series-chart/scrap-type-time-series-chart.module';
export { ScrapTypeTimeSeriesChartService as ɵg } from './lib/components/scrap-type-time-series-chart/scrap-type-time-series-chart.service';
export { WorkplaceActiveStatusWidgetComponent as ɵb } from './lib/components/workplace-active-status-widget/workplace-active-status-widget.component';
export { WorkplaceActiveStatusWidgetModule as ɵa } from './lib/components/workplace-active-status-widget/workplace-active-status-widget.module';
export { DatePipe as ɵd } from './lib/shared/pipes/date.pipe';
export { TimerPipe as ɵc } from './lib/shared/pipes/timer.pipe';

//# sourceMappingURL=company-core-ui.d.ts.map

经过一些研究，我发现了一个issue on the ng-packagr，上面的最后一条评论也问了同样的问题，但这个问题已经解决了。有没有人知道问题出在哪里，以及如何正确配置我的angular库项目？

我使用了angular 12。下面是库项目的配置。

tsconfig.json

{
    "compileOnSave": false,
    "compilerOptions": {
        "rootDir": ".",
        "sourceMap": true,
        "declaration": false,
        "moduleResolution": "node",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "importHelpers": true,
        "target": "es2015",
        "module": "esnext",
        "typeRoots": ["node_modules/@types"],
        "lib": ["es2020", "dom"],
        "skipLibCheck": true,
        "skipDefaultLibCheck": true,
        "baseUrl": ".",
        "paths": {
            "@company/core-ui": ["dist/core-ui", "libs/core-ui/src/index"],
            "@company/core-ui/*": ["libs/core-ui", "libs/core-ui/*"]
        }
    },
    "exclude": ["node_modules", "tmp"]
}

tsconfig.lib.json

{
    "extends": "./tsconfig.json",
    "compilerOptions": {
        "outDir": "../../dist/out-tsc",
        "target": "es2015",
        "declaration": true,
        "inlineSources": true,
        "types": [],
        "lib": ["dom", "es2018"]
    },
    "angularCompilerOptions": {
        "skipTemplateCodegen": true,
        "strictMetadataEmit": true,
        "enableResourceInlining": true,
        "enableIvy": false
    },
    "exclude": ["src/test-setup.ts", "**/*.spec.ts", "**/*.stories.ts", "**/*.stories.js"],
    "include": ["**/*.ts"]
}

Answer 1

解决方案是显式地导出令牌，以避免丑化。所以在最外面的桶里我必须

export { ScrapTypeTimeSeriesChartComponent } from './lib/components/scrap-type-time-series-chart/scrap-type-time-series-chart.component';
...