如何使用赛普拉斯获得比“Webpack 编译错误”更多的细节？答案

【问题标题】：How to get more detail than 'Webpack Compilation Error' with Cypress?如何使用赛普拉斯获得比“Webpack 编译错误”更多的细节？
【发布时间】：2019-11-20 00:40:03
【问题描述】：

每当我的一个导入模块中出现错误时，我从赛普拉斯得到的只是消息Error: Webpack Compilation Error。任何地方似乎都没有有用的错误堆栈，因此不得不寻找错误的根源令人难以置信。我想知道是否有办法获取有关错误的更多详细信息？

我正在使用 TypeScript 编写测试并使用 cypress-webpack-preprocessor 编译测试代码。

这是我传递给 cypress-webpack-preprocessor 的 webpack.config.js：

module.exports = {
  mode: 'development',
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        exclude: [/node_modules/],
        use: [
          {
            loader: 'ts-loader'
          }
        ]
      }
    ]
  },
  resolve: {
    extensions: ['.ts', '.tsx', '.js']
  }
};

这是可爱的错误信息的截图：

【问题讨论】：

有什么解决办法吗？我们遇到了同样的错误。
@tamarabyte 恐怕不会...也许在cypress repo 上打开一个问题？
也遇到了这个问题...

标签： javascript typescript webpack cypress

【解决方案1】：

const { should } = require("chai")

从您的代码中删除上述行。此行可能位于您的 commands.js 文件的顶部。

【讨论】：

【解决方案2】：

我观察到提供不正确的路径可能会导致此错误。尝试给出如下所示的完整路径。

路径不正确

import { Login } from 'Login.js';

正确的路径

import { Login } from '../page-object-model/Login.js';

【讨论】：

【解决方案3】：

您可以通过在调试模式下运行 cypress documentation 来查看您的 webpack 日志

Mac/Linux

DEBUG=cypress:* cypress run

窗户

set DEBUG=cypress:*
cypress run

这是相当多的输出，因为 cypress 所做的所有事情都有日志记录 - 其中之一是 cypress:webpack，它可以为您提供完整的消息。

【讨论】：

谢谢，这为我指明了正确的方向！默认情况下，它们确实应该显示用户友好的错误消息，但现在就足够了！