reactjs Jest无法找到模块,但仅在Github Actions上运行时才能找到

9gm1akwq  于 2023-01-25  发布在  React
关注(0)|答案(1)|浏览(201)

我的Github操作已经失败了好几次了,它以前运行得很好,没有新的或修改过的测试,甚至我没有修改过页脚组件,唯一的变化是布局的方式,本地一切运行良好。
错误记录如下:

Run npm run test

> lasbrumasapp@0.1.0 test
> jest

"next/jest" is currently experimental. https://nextjs.org/docs/messages/experimental-jest-transformer
FAIL __tests__/pages/signup.test.tsx
  ● Test suite failed to run

    Cannot find module '../footer/Footer' from 'components/layouts/Layout.tsx'

    Require stack:
      components/layouts/Layout.tsx
      pages/signup.tsx
      __tests__/pages/signup.test.tsx

       6 | const Layout = ({ children }: ChildrenInterface) => {
       7 |   return (
    >  8 |     <>
         |       ^
       9 |       <Navbar />
      10 |       <main>{children}</main>
      11 |       <Footer />

      at Resolver.resolveModule (node_modules/jest-resolve/build/resolver.js:324:11)
      at Object.<anonymous> (components/layouts/Layout.tsx:8:38)

FAIL __tests__/pages/login.test.tsx
  ● Test suite failed to run

    Cannot find module '../footer/Footer' from 'components/layouts/Layout.tsx'

    Require stack:
      components/layouts/Layout.tsx
      pages/login.tsx
      __tests__/pages/login.test.tsx

       6 | const Layout = ({ children }: ChildrenInterface) => {
       7 |   return (
    >  8 |     <>
         |       ^
       9 |       <Navbar />
      10 |       <main>{children}</main>
      11 |       <Footer />

      at Resolver.resolveModule (node_modules/jest-resolve/build/resolver.js:324:11)
      at Object.<anonymous> (components/layouts/Layout.tsx:8:38)

Test Suites: 2 failed, 2 total
Tests:       0 total
Snapshots:   0 total
Time:        2.555 s
Ran all test suites.

下面是我的jest.config.js

// jest.config.js
const nextJest = require('next/jest');

const createJestConfig = nextJest({
  // Provide the path to your Next.js app to load next.config.js and .env files in your test environment
  dir: './',
});

// Add any custom config to be passed to Jest
const customJestConfig = {
  setupFilesAfterEnv: ['<rootDir>/jest.setup.js'],
  // if using TypeScript with a baseUrl set to the root directory then you need the below for alias' to work
  moduleNameMapper: {
    // Handle module aliases (this will be automatically configured for you soon)
    '^@/components/(.*)$': '<rootDir>/components/$1',

    '^@/pages/(.*)$': '<rootDir>/pages/$1',
  },
  moduleDirectories: ['node_modules', '<rootDir>/'],
  testEnvironment: 'jest-environment-jsdom',
};

// createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async
module.exports = createJestConfig(customJestConfig);

这是我的项目结构:

下面是我的github动作yml:

name: Jest
on: pull_request
jobs:
  test:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - name: Setup Node.js
        uses: actions/setup-node@v1
        with:
          node-version: '16.5.0'

      # Speed up subsequent runs with caching
      - name: Cache node modules
        uses: actions/cache@v2
        env:
          cache-name: cache-lasbrumas-node-modules
        with:
          # npm cache files are stored in `~/.npm` on Linux/macOS
          path: ~/.npm
          key: ${{ runner.os }}-build-${{ env.cache-name }}-${{ hashFiles('**/package-lock.json') }}
          restore-keys: |
            ${{ runner.os }}-build-${{ env.cache-name }}-
            ${{ runner.os }}-build-
            ${{ runner.os }}-

      # Install required deps for action
      - name: Install Dependencies
        run: npm install
        working-directory: ./lasbrumas-app

      # Finally, run our tests
      - name: Run the tests
        run: npm run test
        working-directory: ./lasbrumas-app

这也是我的布局。tsx,奇怪的是,导航栏几乎和页脚一样,但这确实解决了一些问题。

import React, { ReactElement } from 'react';
import { ChildrenInterface } from '../../interfaces/shared/ReactInterfaces';
import Footer from '../footer/Footer';
import { Navbar } from '../navbar/Navbar';

const Layout = ({ children }: ChildrenInterface) => {
  return (
    <>
      <Navbar />
      <main>{children}</main>
      <Footer />
    </>
  );
};

export const getLayout = (page: ReactElement) => <Layout>{page}</Layout>;

export default Layout;
abithluo

abithluo1#

我也遇到过同样的问题,根本原因是重命名文件。如果你最近重命名了任何文件,你可能也遇到了同样的问题。你可以在github上检查文件名,看看字母大小写是否有任何不同。如果有,你可以通过使用Git CLI更正文件名来修复。
如果这是因为重命名,请尝试:

git rm -r --cached . && git add --all .

相关问题