Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Cypress breaks webpack compiling when installed as an npm package

See original GitHub issue

Current behavior:

Currently when I install the cypress npm package on my angular cli project it breaks webpack compiling. The error only happens when after cypress is installed via npm and then ng serve is run to trigger webpack compiling.

The repository itself has no trouble compiling pre-cypress or any other npm package

It seems related to lodash we define lodash as

import * as _ from 'lodash';

Please see the stack trace down the bottom

Desired behavior:

cypress should not break webpack compiling

How to reproduce:

Create and Angular 4 project and try to compile is after cypress is installed as an npm package

Additional Info (images, stack traces, etc)

ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (198,41): Property 'uNumber' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/_global/modal/party-select/party-select-modal.component.ts (126,21): Property 'partyRoleName' does not exist on type 'Party'.
ERROR in /Users/Josh/Desktop/ui/src/app/contacts/contact-form/contact-form.component.ts (422,41): Property 'TelephoneNumber' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/contacts/contact-details/contact-details.component.ts (93,16): Property 'RoleName' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/contacts/contact-details/contact-details.component.ts (93,37): Property 'RoleType' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/contacts/contact-details/contact-details.component.ts (127,64): Property 'TypeID' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/contacts/contact-details/contact-details.component.ts (128,16): Property 'Type' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/contacts/contact-details/contact-details.component.ts (147,17): Property 'Number' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/contacts/contact-details/contact-details.component.ts (147,41): Property 'Number' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/contacts/contact-details/contact-details.component.ts (148,66): Property 'TTypeID' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/contacts/contact-details/contact-details.component.ts (149,17): Property 'NumberType' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/contacts/contact-details/contact-details.component.ts (168,65): Property 'EmailTypeID' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/contacts/contact-details/contact-details.component.ts (169,17): Property 'emailType' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/account-form/account-form.component.ts (494,17): Property 'telephoneNumber' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/account-form/account-form.component.ts (494,41): Property 'TelephoneNumber' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (110,16): Property 'partyRoleName' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (110,37): Property 'PartyRoleType' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (178,65): Property 'AddressTypeID' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (179,16): Property 'addressType' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (198,17): Property 'telephoneNumber' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/contacts/contact-form/contact-form.component.ts (422,17): Property 'telephoneNumber' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (199,17): Property 'telephoneNumberType' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (199,75): Property 'TelephoneTypeID' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (200,17): Property 'telephoneNumberType' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (200,45): Property 'telephoneNumberType' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (200,73): Property 'telephoneNumberType' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (201,17): Property 'communicationType' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (201,72): Property 'CommunicationTypeID' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (202,17): Property 'communicationType' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (202,43): Property 'communicationType' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (202,69): Property 'communicationType' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (221,17): Property 'emailType' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (221,65): Property 'EmailTypeID' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (222,17): Property 'communicationType' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/accounts/user-details/user-details.component.ts (222,72): Property 'CommunicationTypeID' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/templates/cat-form/cat-form.component.ts (111,63): Property 'value' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/templates/cat-form/cat-form.component.ts (111,75): Property 'value' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/templates/dog-form/dog-form.component.ts (135,63): Property 'value' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/templates/dog-form/dog-form.component.ts (135,75): Property 'value' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/templates/flyer-form/flyer-form.component.ts (128,63): Property 'value' does not exist on type '{}'.
ERROR in /Users/Josh/Desktop/ui/src/app/templates/flyer-form/flyer-form.component.ts (128,75): Property 'value' does not exist on type '{}'.

webpack: Failed to compile.

Operating System: Mac Osx
Cypress Version: latest
Browser Version: 63 chrome

Issue Analytics

State:
Created 6 years ago
Reactions:1
Comments:13 (4 by maintainers)

Top GitHub Comments

5reactions

georgegrafoscommented, Dec 1, 2018

Hi, is there any update to this issue?

I have had similar issues as stated above with running yarn ng for my project. This results in errors being thrown anywhere lodash is used in the project. As @alexmgrant mentioned, removing @types/lodash does fix the issue, but this doesn’t seem like an ideal fix.

Upon installation, Cypress adds @types/lodash to my project’s node_modules. I thought it might be versioning issues, but even matching my project’s lodash version with the one Cypress uses made no difference. I’ve tried excluding Cypress in tsconfig.json as well as specifying which types to use, excluding lodash and it did not fix the issue.

2reactions

alexmgrantcommented, Jul 12, 2018

This is most definitely an issue. My build fails on first compile throwing type errors where lodash is used, only when cypress is installed via npm. "cypress" is ignored in tsconfig.ts.

*edit I was able to get this working. I added cypress to ignore in tsconfig.ts & removed @types/lodash from my project.

Top Results From Across the Web

Cypress complains on a Webpack build of Pdfjs-dist which ...

Cypress seems to point at an error in Webpack, as if compiling the code did not work fine, yet the applications shows no...

@cypress/webpack-preprocessor - npm

Cypress preprocessor for bundling JavaScript via webpack. Latest version: 5.16.0, last published: 9 days ago.

Troubleshooting | Cypress Documentation

Here is how you can launch Cypress directly without the npm CLI module. First, find where the binary is installed using the cypress...

Migrate from v4 - Vue CLI

npm install -g @vue/cli # OR yarn global add @vue/cli ... the following section for detailed breaking changes introduced in each package.

Watch and WatchOptions | webpack

This means that after the initial build, webpack will continue to watch for changes in any of the resolved files. webpack.config.js module.exports ...