Reactjs `在快照测试组件期间未定义PropTypes

摘要：我收到一个

引用错误：未定义PropTypes

错误，导致在我的react组件上使用以下命令运行快照测试时测试套件失败：

jest Idea-test.js-c jest config.json

我检查的内容：

import 'raf/polyfill';
import React from 'react';
import Ideas from '../../Ideas';
const renderer = require('react-test-renderer');

it('renders correctly', () => {
    const tree = renderer
      .create(<Ideas
        Title='Title'
        Body='Share your ideas'
        Link='https://shareyouridea.already'
        LinkText='Need ideas now.'
        />
      )
      .toJSON();
    expect(tree).toMatchSnapshot();
});

• 我检查了

  eslint是否有不同的版本（我没有，我有
  3.x.x
  ）

• 从组件中注释prop类型验证可以消除错误并通过测试
• 测试文件中的

  import

  或

  require（）

  PropType无效

组件：

import React from 'react';
import { Module, ModuleHeader, ModuleBody } from 'carbon-components-react';
import PropTypes from 'prop-types';

const Ideas = props =>
  (
    <Module className="ideas">
      <ModuleHeader className="header">
        {`${props.Title}`}
      </ModuleHeader>
      <ModuleBody className="body">
        {`${props.Body}`}
        <a href={props.Link}>
          {`${props.LinkText}`}
        </a>
      </ModuleBody>
    </Module>
  );

Ideas.propTypes = {
  Title: PropTypes.string.isRequired,
  Body: PropTypes.string.isRequired,
  Link: PropTypes.string.isRequired,
  LinkText: PropTypes.string.isRequired,
};

export default Ideas;

从“React”导入React；
从“碳成分反应”导入{Module，ModuleHeader，ModuleBody}；
从“道具类型”导入道具类型；
const Ideas=props=>
(
{`${props.Title}`}
{`${props.Body}`}
);
Ideas.propTypes={
标题：PropTypes.string.isRequired，
正文：需要PropTypes.string.isRequired，
链接：PropTypes.string.isRequired，
LinkText:PropTypes.string.isRequired，
};
输出默认想法；

快照测试文件：

import 'raf/polyfill';
import React from 'react';
import Ideas from '../../Ideas';
const renderer = require('react-test-renderer');

it('renders correctly', () => {
    const tree = renderer
      .create(<Ideas
        Title='Title'
        Body='Share your ideas'
        Link='https://shareyouridea.already'
        LinkText='Need ideas now.'
        />
      )
      .toJSON();
    expect(tree).toMatchSnapshot();
});

导入“raf/polyfill”；
从“React”导入React；
从“../../Ideas”导入想法；
const renderer=require（'react-test-renderer'）；
它（'正确渲染'，（）=>{
常量树=渲染器
.创造(
)
.toJSON（）；
expect（tree.toMatchSnapshot（）；
});

@Ketcomp当您使用

组件运行应用程序时，是否也会出现

引用错误：未定义PropTypes

错误

---

如果是这样，我想在尝试安装

prop-types

包时可能发生了一些事情。你的

package.json

看起来像什么？

从React 15到React 16的

道具类型发生了一些变化-你可以看到一些变化。也许
carbon components react
正在调用旧版本/样式？
不，应用程序运行良好，
包.json
对prop-type依赖项有以下内容：
“prop-types”：“^15.5.10”
（Re-do
npm-install
也不能解决问题。）这里不是这样，我验证了
碳成分反应
确实没有使用任何旧的惯例。我的解决方案是使用babel插件
https://www.npmjs.com/package/babel-plugin-transform-react-remove-prop-types
在测试和生产环境中从源文件中删除道具类型验证代码。