首页 > 解决方案 > Heroku 部署失败:无法加载在“package.json”中声明的插件“cypress”:找不到模块“eslint-plugin-cypress”

问题描述

经过更多研究后更新#2

再看一下构建日志,看起来赛普拉斯是通过一个 postinstall 钩子安装的,该钩子下载了一个二进制文件,Heroku 由于某种原因在构建过程中没有选择,除非 config 设置为NPM_CONFIG_PRODUCTION=false. 比较失败的构建日志成功的构建日志,这个 postinstall 钩子没有运行:

> cypress@6.0.0 postinstall /tmp/build_0453cc7d/frontend/node_modules/cypress

为什么这个和其他可能devDependencies没有安装之前npm run build似乎没有记录并且与devDependencies默认安装的 Heroku 文档相反。

使用更多构建信息更新 #1

这是一个要点,显示了失败的构建日志和成功的构建日志(在配置 Heroku 不devDependencies使用修剪之后heroku config:set NPM_CONFIG_PRODUCTION=false)。

https://gist.github.com/ddehart/9e0ca72a3f20f104e05d70eed6de6c64

修剪似乎是在构建过程安装 Cypress 之后启动的,因此不清楚为什么设置会NPM_CONFIG_PRODUCTION=false提示 Cypress 安装,尽管 Heroku 的文档说:

默认情况下,Heroku 将安装 和 下列出的所有package.json依赖dependenciesdevDependencies

原始问题

npm run build部署到 Heroku 时出现此错误:

Failed to load plugin 'cypress' declared in 'package.json': Cannot find module 'eslint-plugin-cypress'

这是我package.json的参考:

{
  "name": "frontend",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.11.6",
    "@testing-library/react": "^11.2.2",
    "@testing-library/user-event": "^12.2.2",
    "react": "^17.0.1",
    "react-dom": "^17.0.1",
    "react-scripts": "^4.0.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "cypress:open": "cypress open",
    "cypress:run": "cypress run"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "plugin:cypress/recommended"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "@testing-library/cypress": "^7.0.2",
    "cypress": "^6.0.0",
    "eslint-plugin-cypress": "^2.11.2"
  }
}

该项目是使用 Create React App 启动的。npm run build成功在本地没有任何问题,所以我首先认为 Heroku 可能正在修剪devDependencies,但回顾其他成功的构建日志表明修剪发生在成功构建之后。

如果有帮助,这是我package.json上次成功构建的内容。

{
  "name": "frontend",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.5.0",
    "@testing-library/user-event": "^7.2.1",
    "react": "^16.14.0",
    "react-dom": "^16.14.0",
    "react-scripts": "3.4.3"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "cypress:open": "cypress open"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "plugin:cypress/recommended"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "cypress": "^5.4.0",
    "eslint-plugin-cypress": "^2.11.2"
  }
}

认为构建正在抱怨这一点,尽管与上一次成功构建相比并没有改变。

  "eslintConfig": {
    "extends": [
      "react-app",
      "plugin:cypress/recommended"
    ]
  },

删除该插件声明当然会破坏我的 IDE 中的赛普拉斯。有什么方法可以解决 Heroku 实例本身的构建错误或故障排除?

标签: node.jsherokunpmeslintcypress

解决方案


而不是设置NPM_CONFIG_PRODUCTION=false,我最终将赛普拉斯移动eslintConfig到目录中自己的.eslintrc.json文件中cypress。由于 Heroku 似乎只挂断了 main 中引用的 Cypress 插件package.json,因此删除该配置完全修复了 Heroku 构建问题,而不会影响我的 IDE,也不必依赖非标准NPM_CONFIG_PRODUCTION设置。

根据赛普拉斯的文档,该.eslintrc.json文件只需要以下推荐规则:

{
  "extends": [
    "plugin:cypress/recommended"
  ]
}

推荐阅读