Стол реквизита не подходит - PullRequest
Новая
       26

Стол реквизита не подходит

0 голосов
/ 26 апреля 2019

При использовании babel 7 для переноса файла машинописного текста не требуется. Github ссылка для кода. (https://github.com/gmukul01/component-library-ts-boilerplate)

image

Мой файл конфигурации webpack для сборника рассказов выглядит так 

const path = require('path');
const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');

const packages = path.resolve(__dirname, '../', 'packages');
const utils = path.resolve(__dirname, '../', '.storybook/utils');

module.exports = ({ config, mode }) => {
    config.module.rules.push({
        test: /\.(ts|tsx)$/,
        include: [packages, utils],
        exclude: [/node_modules/, /\.test.tsx?$/, /__snapshots__/, /__tests__/, /__dist__/],
        use: ['babel-loader', 'stylelint-custom-processor-loader', 'react-docgen-typescript-loader']
    });
    config.plugins.push(new ForkTsCheckerWebpackPlugin());

    config.resolve.extensions.push('.ts', '.tsx');
    config.resolve.plugins = [new TsconfigPathsPlugin()];

    return config;
};

Мой код для компонента выглядит следующим образом 

import { WithStyle } from '@core-utils/types';
import React from 'react';
import Text from '../Text';
import { ButtonStyled } from './Button.styled';
import { Props } from './types';

import { isValidStringOrNumber } from '@core-utils/helpers/ReactHelper';

export const Button: React.SFC<Props> & WithStyle = props => {
    return (
        <ButtonStyled {...props}>
            {React.Children.map(props.children, c => {
                return isValidStringOrNumber(c) ? (
                    <Text textWeight="Strong" uppercase>
                        {c}
                    </Text>
                ) : (
                    c
                );
            })}
        </ButtonStyled>
    );
};
Button.displayName = 'Button';
Button.Style = ButtonStyled;

export default Button;

И файл типов выглядит так 

import { HTMLProps, WithThemeProp } from '@core-utils/types';

export interface Props extends HTMLProps<HTMLButtonElement>, WithThemeProp {
    type?: 'button' | 'reset' | 'submit';
    solid?: boolean;
    flat?: boolean;
    outlined?: boolean;
}
...