На моем package.json у меня есть эти зависимости:
"dependencies": {
"@my-company-repository/componentXPTO": "19.8.5",
"@my-company-repository/commonComponents": "18.0.2",
"react": "16.12.0",
"react-dom": "16.12.0",
"react-view-model": "^1.0.1",
"react-virtualized": "9.21.0",
"react-virtualized-tree": "3.1.0",
"steal": "^2.1.11",
После npm install на node_modules, @my-company-repository/componentXPTO показывает наличие этих зависимостей:
"bundleDependencies": false,
"deprecated": false,
"peerDependencies": {
"react": "^16.9.0",
"react-dom": "^16.9.0"
},
"dependencies": {
"@my-company-repository/commonComponents": "^17.44.6",
"react-redux": "^5.1.1",
"react-router-dom": "^4.3.1",
"react-scripts": "^3.1.1",
"redux": "^4.0.4",
И @my-company-repository/commonComponents имеют следующие данные:
"peerDependencies": {
"react": "16.12.0",
"react-dom": "16.12.0"
},
ПРИМЕЧАНИЕ. Мне нужны и @my-company-repository/componentXPTO, и @my-company-repository/commonComponents.
Затем я создал этот компонент, где я хочу использовать @my-company-repository/componentXPTO:
import React, { Component } from "react";
import FancyComponent from '@my-company-repository/componentXPTO';
class MyComponentWithFancyC extends Component {
render() {
return (
<div className="my-container">
<span>some text</span>
</div>
);
}
}
export default MyComponentWithFancyC;
Если я прокомментирую строку import FancyComponent from '@my-company-repository/componentXPTO', все будет нормально. Но если я сохраню эту строку, я получу эту красную ошибку при доступе к своему новому компоненту в браузере:
steal.js:7348 Error: Unable to parse package.json for [react]
Unexpected token < in JSON at position 0
1 | <!DOCTYPE html>
2 | <html>
3 | <head lang="en">
4 | <meta charset="utf-8"/>
5 | <meta http-equiv="X-UA-Compatible" content="IE=EDGE"/>
6 | <link rel="icon" href="images/favicon.ico" type="image/x-icon"/>
7 | <link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"/>
8 | <title>My Application</title>
9 | <style>
10 | .app-loading-spinner {
11 | background: url(./src/main/static/images/spinner.gif);
12 | height: 32px;
13 | width: 32px;
14 | position: fixed;
15 | top: 50%;
16 | left: 50%;
17 | z-index: 999999999;
18 | }
19 |
20 | .app-loading-spinner-container {
21 | position: fixed;
22 | top: 0;
23 | left: 0;
24 | height: 100%;
25 | width: 100%;
26 | background-color: rgba(255, 255, 255, 0.3);
27 | z-index: 999999999;
28 | }
29 |
30 | .hide-transition {
31 | -moz-transition: opacity 1s ease-in-out;
32 | -webkit-transition: opacity 1s ease-in-out;
33 | transition: opacity 1s ease-in-out;
34 | opacity: 0;
35 | }
36 |
37 | body {
38 | background-color: #d8dae0;
39 | height: 100%;
40 | margin: 0;
41 | }
42 |
43 | html {
44 | height: 100%;
45 | }
46 |
47 | div.browser-not-supported {
48 | width: 100%;
49 | text-align: center;
50 | padding-top: 100px;
51 | font-size: x-large;
52 | font-family: sans-serif;
53 | }
54 | </style>
55 | </head>
56 | <body>
57 | <div class="app-loading-spinner-container">
58 | <div class="app-loading-spinner">
59 | </div>
60 | </div>
61 | <div id="app" class="app"></div>
62 | <script src="node_modules/babel-polyfill/dist/polyfill.min.js"></script>
63 | <script src="./browser-conditional-renderer.js" environment="DEVELOPMENT"></script>
64 |
65 | <!-- Company Session Management -->
66 | <link rel="stylesheet" type="text/css" href="/sessionmanagement-web/css/sessionmanagement.css">
67 | <script type="text/javascript" src="/sessionmanagement-web/js/ApplicationSupervision.js"></script>
68 | </body>
69 | </html>
70 |
at parse (node_modules/@my-company-repository/componentXPTO/node_modules/react/package.json:0)
Кто-нибудь знает, в чем проблема?
Я уже удалил node_modules и снова установил его, и ошибка остается. Я уже создал новый пустой проект реагирования, в котором я использую только зависимость @my-company-repository/componentXPTO (без @my-company-repository/componentXPTO на package.json), и он отлично работает.
Понятия не имею, как решить эту проблему ...