时间戳

首页 > 解决方案 > Angular 7 ngBuild：require(filename) 不能在 forRoot() 方法中传递

angular - Angular 7 ngBuild：require(filename) 不能在 forRoot() 方法中传递

问题描述

我正在尝试将资产的缓存清除文件名作为我拥有的模块组件的参数传递：

应用模块：

const SPRITE_SRC = {
    raw: '../assets/generated/svg/sprite.svg',
    required: require('../assets/generated/svg/sprite.svg')
};

console.log(SPRITE_SRC)
// output OK : {
//    raw : '../assets/generated/svg/sprite.svg',
//    required: 'sprite-345234dfg54gh6422111111.svg'
// }

@NgModule({
    entryComponents: [...],
    declarations: [...],
    imports: [
        SvgSpriteModule.forRoot(SPRITE_SRC),
    ]
})
export class AppModule {}

SvgSpriteModule（这里一切正常）：

export interface SvgSpriteConfig {
    raw: string;
    required: string;
}

export const PaCommonSvgSpriteConfig = new InjectionToken<SvgSpriteConfig>('SvgSpriteConfig');

export class SvgSpriteModule {
    static forRoot(config?: SvgSpriteConfig): ModuleWithProviders {
        return {
            ngModule: SvgSpriteModule,
            providers: [{ provide: PaCommonSvgSpriteConfig, useValue: config }]
        };
    }
}

但是当我尝试在 thsi SvgSpriteModule 的组件中加载此配置时，该required属性消失了......：

export class SvgSpriteComponent {
    constructor(@Inject(PaCommonSvgSpriteConfig) private config: SvgSpriteConfig) {
        console.log('SvgSpriteComponent', config);
        // output KO : {
        //    raw : '../assets/generated/svg/sprite.svg'
        // }
    }
}

我在不理解的情况下尝试了 3 个小时…… require 函数似乎是同步的，但也许它是异步的？我怎样才能解决这个问题 ？

谢谢

标签： angulartypescriptdependency-injectionrequire

解决方案

最后是不可能的...

最后，我直接创建了一个带有缓存无效文件名的精灵。然后，就在这之后，我有一个 shell 脚本，它将找到新创建的精灵的文件名（由于哈希，它是动态的）......然后我创建一个只包含那个的打字稿文件......比如：

export const SvgSpritePath = 'assets/svg/sprite-4c6d366c.svg';

这样，这个文件可以轻松导入，并在 forRoot() 方法中作为参数传递（在我的内部 Angular 公共库中初始化自定义组件）

推荐阅读