3

我正在尝试使用 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从文件夹外部导入内容也会导致问题。也许有人可以给我举一个他们如何设置的例子吗?

4

0 回答 0