Компоненты не переданы и не транспортируются - PullRequest
Новая
       1

Компоненты не переданы и не транспортируются

0 голосов
/ 25 февраля 2019

Я изменяю уже существующее веб-приложение, и я начал изменять на странице, если с реагировать.

Когда я использую createElement, я могу успешно отображать базовые элементы, такие как кнопки, и также могу иметь обратную связь при нажатии кнопок.

Просто для ознакомления я добавил еще один в свой HTML и назвал его "основным".Простой HTML выглядит так: 

<script src="app/like_button.js" type="text/javascript"></script>
<script src="app/modal.js" type="text/babel"></script>


<div id="buttons"></div>
<div id="main"></div>

Затем я создаю свой modal.js внутри папки приложения: 

// modal trial
class ExampleApp extends React.Component {
  constructor () {
    super();
    this.state = {
      showModal: false
    };
    
    this.handleOpenModal = this.handleOpenModal.bind(this);
    this.handleCloseModal = this.handleCloseModal.bind(this);
  }
  
  handleOpenModal () {
    this.setState({ showModal: true });
  }
  
  handleCloseModal () {
    this.setState({ showModal: false });
  }
  
  render () {
    return (
      <div>
        <button onClick={this.handleOpenModal}>Trigger Modal</button>
        <ReactModal 
           isOpen={this.state.showModal}
           contentLabel="Minimal Modal Example"
        >
          <button onClick={this.handleCloseModal}>Close Modal</button>
        </ReactModal>
      </div>
    );
  }
}

const props = {};

ReactDOM.render(<ExampleApp {...props} />, document.getElementById('main'))

Когда я запускаю свое приложение, я не получаю ошибок, но компонент реагирования не отображается.

Я думаю, что это может быть что-то, связанное с babel.Я установил его, используя информацию из этого: https://babeljs.io/en/setup#installation

У меня также есть package.json, который выглядит следующим образом: 

{
  "name": "--",
  "version": "1.0.0",
  "description": "Prod instance is at https:--",
  "main": "/public/app/main.js",
  "directories": {
    "doc": "doc"
  },
  "dependencies": {
    "axios": "^0.18.0"
  },
  "devDependencies": {
    "@babel/preset-env": "^7.3.1",
    "@babel/preset-react": "^7.0.0",
    "babel-core": "^6.26.3",
    "babel-preset-react-app": "^7.0.1"
  },
  "babel" : {
    "presets": ["es2015", "react" ]
  ,}
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "http:--"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

Я удалил несколько сведений для конфиденциальности.

Надеюсь, вы поможете мне решить эту проблему.

ОБНОВЛЕНИЯ Как и предполагалось, я попытался установить babel, но, похоже, у меня проблемы с сетью.Когда я запускаю: npm install @ babel / preset-env --save-dev, я получаю этот журнал: 

0 info it worked if it ends with ok
1 verbose cli [ '/global/appl/node.js/node-v8.12.0-linux-x64/bin/node',
1 verbose cli   '/global/appl/node.js/prod/bin/npm',
1 verbose cli   'install',
1 verbose cli   '-g',
1 verbose cli   'babel-preset-react-app',
1 verbose cli   '--save-dev' ]
2 info using npm@6.4.1
3 info using node@v8.12.0
4 verbose npm-session 75f9a86bb46d1391
5 silly install loadCurrentTree
6 silly install readGlobalPackageData
7 silly fetchPackageMetaData error for babel-preset-react-app@latest request to https://registry.npmjs.org/babel-preset-react-app failed, reason: getaddrinfo EAI_AGAIN acruz:80
8 timing stage:rollbackFailedOptional Completed in 3ms
9 timing stage:runTopLevelLifecycles Completed in 4862ms
10 verbose type system
11 verbose stack FetchError: request to https://registry.npmjs.org/babel-preset-react-app failed, reason: getaddrinfo EAI_AGAIN acruz:80
11 verbose stack     at ClientRequest.req.on.err (/global/appl/node.js/node-v8.12.0-linux-x64/lib/node_modules/npm/node_modules/node-fetch-npm/src/index.js:68:14)
11 verbose stack     at emitOne (events.js:116:13)
11 verbose stack     at ClientRequest.emit (events.js:211:7)
11 verbose stack     at onerror (/global/appl/node.js/node-v8.12.0-linux-x64/lib/node_modules/npm/node_modules/agent-base/index.js:100:9)
11 verbose stack     at callbackError (/global/appl/node.js/node-v8.12.0-linux-x64/lib/node_modules/npm/node_modules/agent-base/index.js:122:5)
11 verbose stack     at <anonymous>
11 verbose stack     at process._tickCallback (internal/process/next_tick.js:189:7)
12 verbose cwd /home/user/project_name
13 verbose Linux 4.4.103-92.53-default
14 verbose argv "/global/appl/node.js/node-v8.12.0-linux-x64/bin/node" "/global/appl/node.js/prod/bin/npm" "install" "-g" "babel-preset-react-app" "--save-dev"
15 verbose node v8.12.0
16 verbose npm  v6.4.1
17 error code EAI_AGAIN
18 error errno EAI_AGAIN
19 error request to https://registry.npmjs.org/babel-preset-react-app failed, reason: getaddrinfo EAI_AGAIN acruz:80
20 verbose exit [ 1, true ]

Я на самом деле не понимаю, что происходит. Я помню, что читал, что это может быть проблема, связанная с сетью, поскольку я использую прокси, как указано в некоторых комментариях здесь:https://github.com/npm/npm/issues/16661

...