依赖关系库中存在循环引用错误

Question

当我尝试运行我的应用程序时，我会得到这个：

> npm start
Starting the development server...
ts-loader: Using typescript@3.5.3 and C:DevToolsgitui.myavistsconfig.json
Tried to lint C:/DevTools/git/ui.myavis/cypress/integration/doc_upload/doc_upload_spec.js but found no validFailed to compile.
C:/DevTools/git/ui.myavis/node_modules/@types/react-router/node_modules/@types/react/index.d.ts
(239,10): Type alias 'ReactFragment' circularly references itself.

由于这是在依赖关系库中，我该如何解决问题？

这是我的包.json

{
"name": "myavis",
"version": "0.1.0",
"private": true,
"dependencies": {
"@avis/react-framework": "^1.0.0-beta.datepicker-preview",
"@digital/react-avis-atom": "2.0.1",
"@elastic/apm-rum": "^5.6.1",
"@types/react-router-dom": "^4.3.0",
"axios": "^0.18.0",
"classnames": "^2.2.6",
"es6-shim": "^0.35.5",
"formik": "^1.2.0",
"moment": "^2.29.1",
"react": "^16.2.0",
"react-app-polyfill": "^2.0.0",
"react-clickoutside": "^2.0.0",
"react-dom": "^16.2.0",
"react-moment": "^0.7.9",
"react-router-dom": "^4.3.1",
"react-scripts-ts": "2.15.1",
"react-slidedown": "^1.3.0"
},
"scripts": {
"start": "react-scripts-ts start",
"build": "sh -ac '. ./.env.${REACT_APP_ENV}; react-scripts-ts build'",
"build:sys": "REACT_APP_ENV=sys npm run build",
"build:uat": "REACT_APP_ENV=uat npm run build",
"build:production": "REACT_APP_ENV=production npm run build",
"tslint": "tslint -t stylish -c tslint.json -e '**/node_modules/**/*' 'src/**/*.+(ts|tsx)'",
"lint": "yarn tslint",
"test": "react-scripts-ts test --env=jsdom",
"eject": "react-scripts-ts eject",
"uploadSrcMap": "NODE_TLS_REJECT_UNAUTHORIZED=0 node ./tools/sourceMapUploader.js"
},
"devDependencies": {
"@types/enzyme": "^3.1.9",
"@types/enzyme-adapter-react-16": "^1.0.2",
"@types/jest": "^22.2.3",
"@types/node": "^9.4.6",
"@types/react": "^16.0.38",
"@types/react-dom": "^16.0.4",
"@types/react-test-renderer": "^16.0.1",
"axios-mock-adapter": "^1.15.0",
"enzyme": "^3.6.0",
"enzyme-adapter-react-16": "^1.5.0",
"jest": "^22.4.3",
"jsdom": "^11.12.0",
"react-console-component": "^0.6.1",
"react-test-renderer": "^16.3.2",
"ts-jest": "^22.4.3",
"typescript": "3.5"
},
"jest": {
"collectCoverageFrom": [
"src/**/*.{ts,tsx}",
"!src/types/*",
"!src/setupTests.ts",
"!src/index.tsx"
],
"coverageThreshold": {
"global": {
"branches": 67,
"functions": 68,
"lines": 78,
"statements": 78
}
}
}
}

这是doc_upload_spec.js

describe('Upload document', () => {
it('should upload a driving licence in JPEG file format successfully and navigate back to MyAviva Home page', () => {
cy.login();
cy.get('.access_button').should('contain', 'Upload documents');
cy.contains('Upload documents').click();
cy.window().then(window => {
expect(window.sessionStorage.getItem('TRACKING_ID')).toBeTruthy;
});
cy.get('.a-file-upload__label')
.eq(0)
.should('contain', 'Driving Licence');
cy.get('.a-file-upload__label')
.eq(1)
.should('contain', 'No Claims Bonus');
cy.get('input[type=file]')
.eq(0)
.uploadFile('file-sample-jpg', 'image/jpeg');
cy.get('.terms-and-conditons-container').should('contain', 'By uploading your driving licence');
cy.get('.a-button--primary').should('contain', 'I agree');
cy.get('.a-button--secondary').should('contain', 'I do not agree');
cy.contains('I agree').click();
cy.get('.a-loading-indicator-container').should('contain', 'Please wait');
cy.wait(10000).then(() => {
cy.get('.a-heading--2').should('contain', 'Thank You');
cy.get('.a-button--primary').should('contain', 'Upload another document');
cy.get('.a-button--secondary').should('contain', 'Back to MyAviva');
cy.contains('Back to MyAviva').click();
cy.get('.access_button').should('contain', 'Upload documents');
cy.get('.access_button').should('contain', 'View documents');
cy.get('.a-button--primary').should('contain', 'Access and edit policy');
});
});
it('should upload a driving licence in PDF file format successfully and navigate back to document selection page by clicking upload another', () => {
cy.login();
cy.contains('Upload documents').click();
cy.get('input[type=file]')
.eq(1)
.uploadFile('file-sample-pdf', 'application/pdf');
cy.get('.terms-and-conditons-container').should(
'contain',
'By uploading your No-Claims Bonus/Discount you are confirming that:'
);
cy.contains('I agree').click();
cy.get('.a-loading-indicator-container').should('contain', 'Please wait');
cy.wait(10000).then(() => {
cy.get('.a-heading--2').should('contain', 'Thank You');
cy.contains('Upload another document').click();
cy.get('.a-file-upload__label')
.eq(0)
.should('contain', 'Driving Licence');
cy.get('.a-file-upload__label')
.eq(1)
.should('contain', 'No Claims Bonus');
});
});
it('show file type validation error if the selected file type is not supported', () => {
cy.login();
cy.contains('Upload documents').click();
cy.get('input[type=file]')
.eq(1)
.uploadFile('file-sample-text', 'plain/txt');
cy.get('.m-form-row__error-message').should(
'contain',
'This file type is not supported. Please choose a PDF or JPG.'
);
});
it('show file size validation error if the selected file exceeds 5mb', () => {
cy.login();
cy.contains('Upload documents').click();
cy.get('input[type=file]')
.eq(0)
.uploadLargeFile('file-sample-large-jpg', 'image/jpeg');
cy.get('.m-form-row__error-message').should(
'contain',
'This file exceeds the maximum size of 5MB. Please choose another file.'
);
});
it('should show an error if the uploaded document is password protected', () => {
cy.login();
cy.contains('Upload documents').click();
cy.get('input[type=file]')
.eq(1)
.uploadFile('file-sample-encrypted', 'application/pdf');
cy.get('.terms-and-conditons-container').should(
'contain',
'By uploading your No-Claims Bonus/Discount you are confirming that:'
);
cy.contains('I agree').click();
cy.get('.a-loading-indicator-container').should('contain', 'Please wait');
cy.wait(10000).then(() => {
cy.get('.a-results-page__label').should(
'contain',
'We could not upload your document as it is password protected. Remove password or save as a JPG / screenshot before uploading.'
);
cy.get('.a-button--primary').should('contain', 'Try again');
cy.contains('Try again').click();
cy.get('.a-file-upload__label')
.eq(0)
.should('contain', 'Driving Licence');
cy.get('.a-file-upload__label')
.eq(1)
.should('contain', 'No Claims Bonus');
});
});
});

我有Nodev14.15.1和npmv6.14.8。

此外，当我运行npm list时，我在输出中看到了这一点：

-- UNMET PEER DEPENDENCY typescript@3.5.3
npm ERR! peer dep missing: react@^15.1.0, required by react-console-component@0.6.1
npm ERR! peer dep missing: react-dom@^15.1.0, required by react-console-component@0.6.1
npm ERR! peer dep missing: typescript@2.x, required by react-scripts-ts@2.15.1
npm ERR! peer dep missing: typescript@2.x, required by ts-jest@22.4.6
npm ERR! peer dep missing: typescript@^2.1.0, required by fork-ts-checker-webpack-plugin@0.2.10
npm ERR! peer dep missing: typescript@2.x, required by ts-jest@22.0.1
npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.2

Answer 1

我认为您已经混合了几个版本的React。

删除您的node_modules和package-lock.json，然后重新运行npm install。