我正在尝试使用 next.js 和 typescript 设置 React styleguidist,但我一直遇到问题。我当前的 styleguide.config.js 看起来像这样:
const path = require('path');
module.exports = {
components: './components/**/*.tsx',
propsParser: require('react-docgen-typescript').withCustomConfig('./tsconfig.json', {
propFilter: { skipPropsWithoutDoc: true },
}).parse,
webpackConfig: {
resolve: {
alias: {
static: path.join(__dirname, 'static'),
lib: path.join(__dirname, 'lib'),
},
},
module: {
rules: [
{
test: /\.(ts|tsx)$/,
exclude: /node_modules/,
use: [
{
loader: 'ts-loader',
},
{
loader: 'babel-loader',
},
],
},
{
test: /\.(png|jpg|gif|svg)$/,
use: [
{
loader: 'file-loader',
options: {
outputPath: 'images',
},
},
],
},
],
},
},
};
如果我只有一个非常基本的组件,只有基本的 jsx 一切正常,但是一旦我想为样式组件分配道具,打字稿就会开始抱怨。components
从文件夹外部导入内容也会导致问题。也许有人可以给我举一个他们如何设置的例子吗?