diff --git a/packages/@vue/cli-ui/src/components/PackageSearchItem.vue b/packages/@vue/cli-ui/src/components/PackageSearchItem.vue index de6d3bba3e..da6c11dc6b 100644 --- a/packages/@vue/cli-ui/src/components/PackageSearchItem.vue +++ b/packages/@vue/cli-ui/src/components/PackageSearchItem.vue @@ -6,7 +6,7 @@ }" > @@ -62,10 +62,39 @@ export default { } }, + data () { + return { + logoUrl: null + } + }, + computed: { official () { return this.pkg.owner.name === 'vuejs' } + }, + + watch: { + pkg: { + handler: 'updateLogo', + immediate: true + } + }, + + methods: { + updateLogo () { + // By default, show the npm user avatar + this.logoUrl = this.pkg.owner.avatar + + // Try to load the logo.png file inside the package + const name = this.pkg.name + const img = new Image() + img.onload = () => { + if (name !== this.pkg.name) return + this.logoUrl = img.src + } + img.src = `https://unpkg.com/${name}/logo.png` + } } }