CODEWITHSUNDEEP
reactjsjsxbabeljs
cikatomo
cikatomo

Reputation: 1632

Line 0: Parsing error: Invalid array length in react app

Using VScode I followed Mosh tutorial on youtube: https://youtu.be/Ke90Tje7VS0?t=1080

The first code is to write in index.js:

import React from 'react';
import ReactDOM from 'react-dom';

const element = </h1>Hello World</h1>;

and it's already giving me error:

Failed to compile.

./src/index.js
  Line 0:  Parsing error: Invalid array length

It's caused by const element = </h1>Hello World</h1>; line.

If I put quotes like this const element = '</h1>Hello World</h1>'; then it compiles.

What could be the case?

EDIT: I didn't notice I used closing tag at the beginning.

Upvotes: 1

Views: 803

Answers (3)

BillyN
BillyN

Reputation: 185

React uses JSX, or TSX to blend UI with logic.

JSX esentially combine HTML with javascript logic in the same location.

The element has a closing tag in the wrong postion

const element = <h1>Hello, world!</h1>;

If you assign element to '<h1>Hello, world!</h1>' it will just create a javascript constant with the string value.

Upvotes: 1

Alfonso Tienda
Alfonso Tienda

Reputation: 3699

The JSX tags must be opened and closed, as HTML tags.

You have two closing tags. (</h1>)

Try:

import React from 'react';
import ReactDOM from 'react-dom';

const element = <h1>Hello World</h1>;

Upvotes: 1

Prathap Reddy
Prathap Reddy

Reputation: 1749

It seems there is a typo, It should be a valid JSX tag (The closing tag </h1> at the begging might be causing issue)

const element = <h1>Hello World</h1>;

Upvotes: 1

Related Questions