如何正确配置带有SWC、Jest、Eslint和TypeScrip的NextJS 12.2?

nvbavucw  于 2022-10-01  发布在  Jest
关注(0)|答案(1)|浏览(210)

使用VSCode,无法用Jest文件解决下一个/babel错误。有什么建议吗?

我正在使用带有SWC的NextJS,并且在我的.eslintrc文件中有“Expanses”:“Next”。
分析错误:找不到模块‘Next/Babel’

下面是我的Package.json文件中的内容。

{
...
  "dependencies": {
    "@emotion/cache": "^11.9.3",
    "@emotion/react": "^11.9.3",
    "@emotion/server": "^11.4.0",
    "@emotion/styled": "^11.9.3",
    "@mui/icons-material": "^5.8.4",
    "@mui/material": "^5.9.2",
    "next": "12.2.3",
    "react": "18.2.0",
    "react-dom": "18.2.0",
  },
  "devDependencies": {
    "@swc/core": "^1.2.220",
    "@swc/jest": "^0.2.22",
    "@testing-library/dom": "^8.16.0",
    "@testing-library/jest-dom": "^5.16.2",
    "@testing-library/react": "^13.3.0",
    "@testing-library/user-event": "14.3.0",
    "@types/node": "^18.6.3",
    "@types/react": "18.0.15",
    "@types/testing-library__jest-dom": "^5.14.5",
    "eslint": "8.20.0",
    "eslint-plugin-testing-library": "^5.6.0",
    "jest": "^28.1.3",
    "jest-environment-jsdom": "^28.1.3",
    "next-transpile-modules": "9.0.0",
    "typescript": "^4.6.2"
}
6psbrbz9

6psbrbz91#

问题由文件类型/扩展名行为引起。使用带有.eslintrc.js文件的Module.Exports导致了该问题。转换为json格式的.eslintrc可解决该错误。

// .eslintrc.js - Does not work

// Commented for testing
// do this module.exports = require("baseconfig/eslint-preset"); 

module.exports = {
    extends: ["prettier", "next/core-web-vitals"],
    plugins: ["testing-library"],
    settings: {
      next: {
        rootDir: ["apps/*/", "packages/*/"],
      },
    },
    rules: {
      "@next/next/no-html-link-for-pages": "off",
    },
    overrides: [
      // Only uses Testing Library lint rules in test files
      {
        "files": [
          "**/__tests__/**/*.[jt]s?(x)",
          "**/?(*.)+(spec|test).[jt]s?(x)"
        ],
        "extends": ["plugin:testing-library/react"]
      }
    ]
  };
// .eslintrc - works
{
    "extends": ["prettier", "next/core-web-vitals"],
    "plugins": ["testing-library"],
    "settings": {
      "next": {
        "rootDir": ["apps/*/", "packages/*/"],
      },
    },
    "rules": {
      "@next/next/no-html-link-for-pages": "off",
    },
    "overrides": [
      // Only uses Testing Library lint rules in test files
      {
        "files": [
          "**/__tests__/**/*.[jt]s?(x)",
          "**/?(*.)+(spec|test).[jt]s?(x)"
        ],
        "extends": ["plugin:testing-library/react"]
      }
    ]
  }

相关问题