Загрузка...

Problem starting React.js server

Thread in Node.js created by FOREST1376 Jun 6, 2024. 278 views

  1. FOREST1376
    FOREST1376 Topic starter Jun 6, 2024 StereoLove 77 Dec 17, 2018
    Failed to compile.

    SyntaxError: C:\Users\Admin\desktop\www\src\index.js: Identifier 'app' has already been declared. (26:6)
    24 | const app = document.getElementById("app")
    25 |
    > 26 | const app = ReactDOMClient.createRoot(document.getElementById("app"))
    | ^
    27 |
    28 | app.render(elements)
    29 |
    at parser.next (<anonymous>)
    at normalizeFile.next (<anonymous>)
    at run.next (<anonymous>)
    at transform.next (<anonymous>)
    ERROR in ./src/index.js
    Module build failed (from ./node_modules/babel-loader/lib/index.js):
    SyntaxError: C:\Users\Admin\desktop\www\src\index.js: Identifier 'app' has already been declared. (26:6)

    24 | const app = document.getElementById("app")
    25 |
    > 26 | const app = ReactDOMClient.createRoot(document.getElementById("app"))
    | ^
    27 |
    28 | app.render(elements)
    29 |
    at constructor (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:351:19)
    at FlowParserMixin.raise (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:3233:19)
    at FlowScopeHandler.checkRedeclarationInScope (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:1493:19)
    at FlowScopeHandler.declareName (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:1459:12)
    at FlowScopeHandler.declareName (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:1560:11)
    at FlowParserMixin.declareNameFromIdentifier (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:7309:16)
    at FlowParserMixin.checkIdentifier (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:7305:12)
    at FlowParserMixin.checkLVal (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:7251:12)
    at FlowParserMixin.parseVarId (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:12865:10)
    at FlowParserMixin.parseVarId (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:5573:11)
    at FlowParserMixin.parseVar (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:12845:12)
    at FlowParserMixin.parseVarStatement (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:12692:10)
    at FlowParserMixin.parseStatementContent (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:12304:23)
    at FlowParserMixin.parseStatementLike (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:12221:17)
    at FlowParserMixin.parseStatementLike (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:5017:24)
    at FlowParserMixin.parseModuleItem (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:12198:17)
    at FlowParserMixin.parseBlockOrModuleBlockBody (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:12778:36)
    at FlowParserMixin.parseBlockBody (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:12771:10)
    at FlowParserMixin.parseProgram (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:12098:10)
    at FlowParserMixin.parseTopLevel (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:12088:25)
    at FlowParserMixin.parseTopLevel (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:5784:28)
    at FlowParserMixin.parse (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:13902:10)
    at parse (C:\Users\Admin\Desktop\www\node_modules\@babel\parser\lib\index.js:13944:38)
    at parser (C:\Users\Admin\Desktop\www\node_modules\@babel\core\lib\parser\index.js:41:34)
    at parser.next (<anonymous>)
    at normalizeFile (C:\Users\Admin\Desktop\www\node_modules\@babel\core\lib\transformation\normalize-file.js:64:37)
    at normalizeFile.next (<anonymous>)
    at run (C:\Users\Admin\Desktop\www\node_modules\@babel\core\lib\transformation\index.js:21:50)
    at run.next (<anonymous>)
    at transform (C:\Users\Admin\Desktop\www\node_modules\@babel\core\lib\transform.js:22:33)
    at transform.next (<anonymous>)
    at step (C:\Users\Admin\Desktop\www\node_modules\gensync\index.js:261:32)
    at C:\Users\Admin\Desktop\www\node_modules\gensync\index.js:273:13
    at async.call.result.err.err (C:\Users\Admin\Desktop\www\node_modules\gensync\index.js:223:11)
    at C:\Users\Admin\Desktop\www\node_modules\gensync\index.js:189:28
    at C:\Users\Admin\Desktop\www\node_modules\@babel\core\lib\gensync-utils\async.js:67:7
    at C:\Users\Admin\Desktop\www\node_modules\gensync\index.js:113:33
    at step (C:\Users\Admin\Desktop\www\node_modules\gensync\index.js:287:14)
    at C:\Users\Admin\Desktop\www\node_modules\gensync\index.js:273:13
    at async.call.result.err.err (C:\Users\Admin\Desktop\www\node_modules\gensync\index.js:223:11)

    ERROR in [eslint] Plugin "react" was conflicted between "package.json » eslint-config-react-app » C:\Users\Admin\desktop\www\node_modules\eslint-config-react-app\base.js" and "BaseConfig » C:\Users\Admin\Desktop\www\node_modules\eslint-config-react-app\base.js".

    webpack compiled with 2 errors


    Что это значит?
     
    1. mdn
      FOREST1376, const на то и const, что ты не можешь переопределять переменную. У тебя две константы и названием app. В создании переменных ты можешь назвать их как хочешь, то есть app и App совершенно разные переменные.
  2. Tu3uK
    Tu3uK Jun 6, 2024 Деньги лёгкие, когда знаешь как их получить. 248 Aug 11, 2019
    Судя по логам, то жалуется на то что дважды объявил app в одном файле.
     
    1. FOREST1376 Topic starter
      Tu3uK, [IMG] Это его код в конце видео . У меня также само только при запуске есть ошибка
    2. FOREST1376 Topic starter
      Tu3uK, В этом видео на 29:40 автор сказал что метод Render еще рабочий но скоро перестанет работать
    3. themms1
      FOREST1376,

      JS


      import React from 'react';
      import ReactDOM from 'react-dom/client';
      import { App } from './App.tsx';
      import './index.css';

      ReactDOM.createRoot(document.getElementById('root')!).render(
      <React.StrictMode>
      <App />
      </React.StrictMode>,
      );

Loading...
Top