Storybook: 파비콘을 변경하는 방법?

버그 설명

스토리 북 정적 빌드 및 개발을위한 커스텀 파비콘을 설정할 수 없습니다. 다음과 같이 config.js 에서 'favicon.ico'를 가져온 후 preview-header.html 및 manager-header.html 에서 다른 URL로 아이콘을 설정하여 HtmlWebpackPlugin을 사용해 보았습니다.

import {
  configure,
  addParameters,
  addDecorator
} from '@storybook/vue'
import {
  Vue
} from 'vue-property-decorator'
import {
  Centered
} from './components/centered'
import {
  Installer
} from '../src/Installer'
import {
  withKnobs
} from '@storybook/addon-knobs'
import '../src/assets/variables.css'
import '../src/assets/theme.css'
import '../src/assets/base.css'
import '../src/sass/main.scss'
import {
  withInfo
} from 'storybook-addon-vue-info'
// We import the favicon here
import './favicon.ico'

Vue.component('Centered', Centered)

const installer = new Installer(Vue)
installer.install(true)

addParameters({
  options: {
    sortStoriesByKind: true
  }
})

const stories = require.context('../src', true, /.stories.ts$/)

function loadStories() {
  stories.keys().forEach(filename => stories(filename))
}

addDecorator(withKnobs)
addDecorator(withInfo)

configure(loadStories, module)

그리고 preview-header.html (또는 manager-header.html ) :

<link rel="shortcut icon" href="./favicon.ico">

우리는 다음 경로도 시도했습니다.

<link rel="icon" href="<%= BASE_URL %>favicon.ico">

과

<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">

첫 번째 옵션을 사용하면 파비콘이 손상되었음을 알 수 있지만 번들에는 파비콘이 표시되지 않습니다.

체계:

• 운영체제 : MacOS
• 기기 : Macbook Pro 2019
• 브라우저 : 모두
• 프레임 워크 : Vue
• 버전 : 5.0.3