Skip to content

在Storybook中定制主题的时候,无法设置ColorBgBase等token的值 #8110

@powanjuanshu

Description

@powanjuanshu
  • I have searched the issues of this repository and believe that this is not a duplicate.

Version

4.2.6

Environment

"storybook": "8.3.5","vue": "^3.2.0","ant-design-vue": "^4.2.6",

Reproduction link

https://github.com/vueComponent/ant-design-vue

Steps to reproduce

/** @type { import('@storybook/vue3').Preview } */
import { setup } from '@storybook/vue3'
import Antd, { theme as antdTheme } from 'ant-design-vue'

import 'ant-design-vue/dist/reset.css'

// 安装组件库
setup(app => {
app.use(Antd)
})

const withThemeProvider = storyFn => ({
components: { Story: storyFn() },
setup() {
const { defaultAlgorithm } = antdTheme

const themeConfig = {
algorithm: defaultAlgorithm,
token: {
colorBgBase: '#ffffffa0',
colorBgLayout: '#f5f5f5a0',
colorBgContainer: '#ffffffa0',
colorBgElevated: '#ffffffa0',
colorBgSpotlight: '#000000a0'
}
}

return {
themeConfig
}
},
template: ''
})

const preview = {
decorators: [withThemeProvider],
parameters: {
controls: {
matchers: {
color: /(background|color)$/i,
date: /Date$/i
}
},
backgrounds: {
default: 'light',
values: [
{ name: 'light', value: '#F8F8F8' },
{ name: 'dark', value: '#333333' }
]
}
}
}

export default preview

What is expected?

在开发环境中设置的背景色生效,但是打包后无效,期望始终生效

What is actually happening?

配置colorBgBase为#ff0000都不行

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions