如何在構建期間排除 next.js 中的測試文件？

Question

我正在頁面目錄中創建帶有測試的 next.js 應用程序。 為此，我已將配置添加到 next.config.js

const { i18n } = require('./next-i18next.config');

const nextConfig = {
    reactStrictMode: true,
    pageExtensions: ['page.tsx', 'page.ts', 'page.jsx', 'page.js'],
    styledComponents: true,
    i18n,
};

module.exports = nextConfig;

我所有的頁面都有擴展名 page.tsx。 例如 Home.page.tsx。 我的測試文件命名如下：Home.spec.tsx。

問題是，我的測試文件仍然包含在構建中。 我確實在我的 tsconfig 文件中排除了它們

{
    "compilerOptions": {
        "target": "es5",
        "lib": ["dom", "dom.iterable", "esnext"],
        "allowJs": true,
        "skipLibCheck": true,
        "strict": true,
        "forceConsistentCasingInFileNames": true,
        "noEmit": true,
        "esModuleInterop": true,
        "module": "esnext",
        "moduleResolution": "node",
        "resolveJsonModule": true,
        "isolatedModules": true,
        "jsx": "preserve",
        "incremental": true,
        "types": ["node", "jest", "@testing-library/jest-dom"]
    },
    "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
    "exclude": ["node_modules", "**/*.spec.ts", "**/*.spec.tsx"]
}

我不確定我還應該做什么

Answer 1

不要將測試放在 pages 目錄中。 如果你這樣做了，NextJS 會認為這個文件是你的應用程序的一個路由，當你嘗試構建你的應用程序時，你會得到這樣的錯誤。

您可以將.spec文件放在任何其他文件夾中，例如/components但不能放在/pages中。 根據文檔，對於測試頁面，您需要在根目錄中創建一個__test__文件夾。

之后隨意更新您的排除設置：

{
"exclude": ["node_modules"]
}