Babel 在运行 Jest 时不会编译 .test.js 文件

2023-12-12

运行yarn run jest --no-cache时,抛出一个错误,内容如下:

SyntaxError: Unexpected token import

我最好的猜测是 babel 没有达到这个测试文件。我需要将它们包含在 .babelrc 中吗?

path:

/src/tests/LandingPage.test.js

测试文件:

import React from 'react';
import ReactShallowRenderer from 'react-test-renderer/shallow';
import LandingPage from '../../components/LandingPage';

test('Should render LandingPage correctly', () => {
  const renderer = new ReactShallowRenderer();
  renderer.render(<LandingPage />);
  expect(renderer.getRenderOutput()).toMatchSnapshot();
});

.babelrc:

{
  "presets": [
    "env",
    "react"
  ],
  "plugins": [
    "transform-class-properties",
    "transform-object-rest-spread"
  ]
}

感谢@hannad rehmann 在正确的方向上的推动,这是对我有用的解决方案。

安装 babel-jest

yarn add babel-jest --dev

为测试环境配置 .babelrc

Jest 会自动设置您的环境进行测试,因此将您想要的任何配置复制到测试环境中。

{
  "presets": [
    "env",
    "react"
  ],
  "plugins": [
    "transform-class-properties",
    "transform-object-rest-spread"
  ],
  "env": {
    "test": {
      "presets": [
        "env",
        "react"
        ],
      "plugins": [
        "transform-class-properties",
        "transform-object-rest-spread"
      ]
    }
  }
}

Add jest.config.json到项目根目录

{
  "transform": {
    "^.+\\.jsx?$": "babel-jest"
  }
}

最后,让您的测试脚本知道在哪里可以找到配置文件

我刚刚将其添加到 package.json 中的测试脚本中,但您也可以在命令行中运行它。

"scripts": {
    "test": "jest --config=jest.config.json --watch"
},
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Babel 在运行 Jest 时不会编译 .test.js 文件 的相关文章

随机推荐

  • Firefox 上奇怪的页面错误

    我在用着Choosen and 推特引导程序在我的项目中 这是jsfiddle http jsfiddle net Wexcode 7HLyZ 3 尝试在 2 个浏览器上打开此 jsFiddle Firefox 和 Chrome 在 chr
  • 使用泛型链接任务

    我正在尝试创建一个用于链接任务的 API 首先 我设计了一个非常简单的界面来定义任务 public interface Task
  • Azure DevOps 服务器上的批处理命令 vcvarsall.bat 出现“输入行太长”错误

    我正在 Azure DevOps 服务器管道上运行批处理文件作为批处理脚本任务 此批处理文件在内部调用英特尔并行工作室编译器 2019 更新 3 如下所示 if ERRORLEVEL NEQ 0 call ICPP COMPILER19 b
  • 如何更改悬停时的文本框内容

    我无法弄清楚如何使文本框根据悬停在哪个链接上来更改内容 我可以让它与最接近 div 的任何一个一起工作 但其他链接似乎没有效果 然而 我不想在链接之间插入文本 也不想创建多个文本框 我的主要目标是让链接始终位于同一位置 当您将鼠标悬停在链接
  • Python 如何处理全局变量?

    我在 Python 中遇到过一些非常奇怪的全局变量处理方式 我希望有人能够解释并证明这些惊喜的合理性 A 此代码按预期打印 10 def func print a a 10 func B 此代码抛出有关过早引用 a 的异常 def func
  • Eclipse 条件调试

    我想知道是否有办法在调试时在 eclipse 中添加条件断点 示例 of city New York 然后中断 是的 右键单击断点 选择 断点属性 启用 条件 然后输入条件 注意city New York 由于 Java 中相等的工作方式
  • 重塑存储在集合中的数组并导出为 CSV

    我有一个 Facebook 页面点赞的集合 标题为页面赞数 存储在 Mongo 数据库 JSON 文件中 以下是一个条目的示例 id ObjectId 4725bf8731b8faf4c04595bb user id 0939bf9w980
  • Bash 中按数字文件名排序的 erge 文本文件

    有没有一种方法可以使用一个 bash 命令按文件名的数字顺序连接多个文本文件 我尝试了这个 但由于某种原因 前三行不按顺序 sort n txt gt all txt 添加这个答案只是因为目前接受的答案建议不好的做法 未来 Hellmar
  • CSS 旋转后 Firefox 中的抗锯齿文本

    所以我读了很多关于旋转文本的当前状态的文章 并且无法在所有浏览器中完美地实现真正的抗锯齿功能 它在 Chrome 中看起来像图片中的第一个框 但在 Firefox 中看起来像第二个锯齿状框 我尝试过最流行的修复程序 包括 webkit ba
  • 获取父级的类型

    给定以下课程 template
  • 无法查询表存储中的日期时间列

    我已使用逻辑应用程序中的 formatDateTime 将一列插入到表存储中 并输入正确的值 并且当我查看记录时 列类型显示为 DateTime 但是 当我尝试查询此字段时 它默认为字符串 即使我将其更改为 DateTime 也不会返回任何
  • 为什么编译 Bootstrap 3 RC1 时会出现 Grunt / Recess 错误,而 Lessc 不会出现错误?

    我向 mixins less 添加一些代码 img extend img responsive 也可以看看 Twitter Bootstrap 3 中的图像默认不响应 and https stackoverflow com a 155732
  • 意图服务在打瞌睡模式下不工作

    我的一位同行开发人员写了一篇intent service进行 API 调用 然后休眠 2 分钟 醒来后 再次发送 下面是代码 public class GpsTrackingService extends IntentService Ove
  • 从 woocommerce 中的电子邮件模板中删除订单信息部分

    我正在尝试删除订单信息已完成订单和客户发票电子邮件的部分 在以下位置找不到如何删除它 wp content plugins woocommerce templates emails customer completed order php
  • 无法修复 Digital Ocean Droplet 上的 NGINX 502:错误网关错误 - Ubuntu 20.04

    我已将我的网站部署到 Digital Ocean Droplet Ubuntu 20 04 服务器 一切都工作正常 今天 我在本地机器上对网站做了一些更改 因此 我将更改推送到 GitHub 然后再次将 GitHub 存储库克隆到服务器 然
  • H2DB和Java,大约>两个小时的差异

    我正在开发一个比赛计时系统 在某些情况下 我需要从 H2DB 检索时间对象 与其兄弟 或姊妹 一样 时间数据类型相对于 1970 年 1 月 1 日 并以 hh mm ss 格式在 SQL 中表示 日期默认设置为 01 01 1970 它默
  • Mysql 查询返回资源 id #8 而不是所需的值[关闭]

    很难说出这里问的是什么 这个问题模棱两可 含糊不清 不完整 过于宽泛或言辞激烈 无法以目前的形式合理回答 如需帮助澄清此问题以便重新打开 访问帮助中心 您好 我正在尝试发现如何修复我的查询以返回正确的结果 这是我的查询 selectShoe
  • 使用python基于两个单词的词频统计

    网上有很多资源展示了如何对单个单词进行字数统计 喜欢this and this and this和别的 但我无法找到两个单词计数频率的具体示例 我有一个 csv 文件 其中包含一些字符串 FileList I love TV show ma
  • 通过 Angular.js 维护会话

    我正在使用 AngularJS 框架开展一个项目 我对使用这个框架还很陌生 过去我只使用纯 JavaScript 和 jQuery 该项目是一种针对利基市场的网页设计师应用程序 当用户在设计时在页面之间移动时 我想维护他们所做的所有更改的会
  • Babel 在运行 Jest 时不会编译 .test.js 文件

    运行yarn run jest no cache时 抛出一个错误 内容如下 SyntaxError Unexpected token import 我最好的猜测是 babel 没有达到这个测试文件 我需要将它们包含在 babelrc 中吗